/* Generated by less 2.5.1 */
@charset "utf-8";
/*
--------------------------------------------------------

Item Information

--------------------------------------------------------

Author: IncisiveStudio
Author UI: http://IncisiveStudio.com
Item Name: Sinister
Description: CSS Animation and Effects
Version: 1.6.4

-------------------------------------------------------- */
.overlay-wrapper {
    display: block;
    overflow: hidden;
    position: relative;
}

.overlay-wrapper .img-thumbnail {
    margin-bottom: 0;
}

.overlay-wrapper.overlay-wrapper-panel {
    margin-bottom: 20px;
}

.panel.panel-overlay {
    margin-bottom: 0;
}

/*  =============================================
Button Layout
============================================= */
.WhiteRounded,
.BlackRounded,
.WhiteHollowRounded,
.BlackHollowRounded,
.WhiteSquare,
.BlackSquare,
.WhiteHollowSquare,
.BlackHollowSquare {
    display: inline-block;
    float: none;
    font-size: 18px;
    margin: 0 2px;
    text-align: center;
}

.WhiteRounded > a,
.BlackRounded > a,
.WhiteHollowRounded > a,
.BlackHollowRounded > a {
    line-height: 40px;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
}

.WhiteSquare > a,
.BlackSquare > a,
.WhiteHollowSquare > a,
.BlackHollowSquare > a {
    line-height: 40px;
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 6px;
}

.WhiteRounded > a {
    background: #fff;
    color: #677287 !important;
}

.BlackRounded > a {
    background: #e74958;
    color: #fff !important;
}

.WhiteHollowRounded > a {
    border: 3px solid #fff;
    line-height: 35px;
    color: #fff !important;
}

.BlackHollowRounded > a {
    border: 3px solid #e74958;
    line-height: 35px;
    color: #e74958 !important;
}

.WhiteSquare > a {
    background: #fff;
    color: #677287 !important;
}

.BlackSquare > a {
    background: #e74958;
    color: #fff !important;
}

.WhiteHollowSquare > a {
    border: 3px solid #fff;
    line-height: 35px;
    color: #fff !important;
}

.BlackHollowSquare > a {
    border: 3px solid #e74958;
    line-height: 35px;
    color: #e74958 !important;
}

.VisibleButtons {
    margin: 0;
    position: absolute;
    text-align: center;
    width: 100%;
    top: 50%;
    margin-top: -20px;
}

.VisibleButtons {
    margin-left: -7%;
}

.visible-overlay-wrapper,
.visible-overlay-wrapperCircle {
    position: absolute;
    background: -webkit-repeating-linear-gradient(-45deg, rgba(144, 153, 170, 0.5), rgba(144, 153, 170, 0.5) 3px, rgba(48, 53, 62, 0.5) 3px, rgba(48, 53, 62, 0.5) 6px);
    background: repeating-linear-gradient(-45deg, rgba(144, 153, 170, 0.5), rgba(144, 153, 170, 0.5) 3px, rgba(48, 53, 62, 0.5) 3px, rgba(48, 53, 62, 0.5) 6px);
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 0;
}

.visible-overlay-wrapperCircle {
    border-radius: 50%;
}

.overlay-wrapper:hover .visible-overlay-wrapper,
.overlay-wrapper:hover .visible-overlay-wrapperCircle {
    opacity: .5;
}

/*Button Hover State*/
.BlackSquare > a:hover,
.WhiteSquare > a:hover,
.WhiteRounded > a:hover,
.BlackRounded > a:hover {
    background: #e74958;
    color: #ffffff !important;
}

.WhiteHollowSquare > a:hover,
.BlackHollowSquare > a:hover,
.WhiteHollowRounded > a:hover,
.BlackHollowRounded > a:hover {
    border-color: #e74958;
    color: #e74958 !important;
}

/*  =============================================
Overlay Effects
============================================= */
.overlay-wrapper .overlayStyleH,
.overlay-wrapper .overlayStyleHe,
.overlay-wrapper .overlayStyleLi:after,
.overlay-wrapper .overlayStyleLi:before,
.overlay-wrapper .overlayStyleBe:after,
.overlay-wrapper .overlayStyleBe:before,
.overlay-wrapper .overlayStyleB,
.overlay-wrapper .overlayStyleC:before,
.overlay-wrapper .overlayStyleC:after,
.overlay-wrapper .overlayStyleN:after,
.overlay-wrapper .overlayStyleN:before,
.overlay-wrapper .overlayStyleO,
.overlay-wrapper .overlayStyleF,
.overlay-wrapper .overlayStyleNe,
.overlay-wrapper .overlayStyleNa,
.overlay-wrapper .overlayStyleMg,
.overlay-wrapper .overlayStyleAl,
.overlay-wrapper .overlayStyleSi,
.overlay-wrapper .overlayStyleS,
.overlay-wrapper .overlayStyleCl,
.overlay-wrapper .overlayStyleArLeft:before,
.overlay-wrapper .overlayStyleArLeft:after,
.overlay-wrapper .overlayStyleArRight:before,
.overlay-wrapper .overlayStyleArRight:after,
.overlay-wrapper .overlayStyleK,
.overlay-wrapper .overlayStyleCa,
.overlay-wrapper .overlayStyleSc,
.overlay-wrapper .overlayStyleTi {
    background: -webkit-repeating-linear-gradient(-45deg, rgba(144, 153, 170, 0.5), rgba(144, 153, 170, 0.5) 3px, rgba(48, 53, 62, 0.5) 3px, rgba(48, 53, 62, 0.5) 6px);
    background: repeating-linear-gradient(-45deg, rgba(144, 153, 170, 0.5), rgba(144, 153, 170, 0.5) 3px, rgba(48, 53, 62, 0.5) 3px, rgba(48, 53, 62, 0.5) 6px);
    display: block;
    opacity: 0;
    position: absolute;
    border-radius: 4px;
}

.overlay-wrapper .overlayStyleH {
    bottom: 0;
    height: 100%;
    left: 0;
    right: 0;
    top: 0;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleH {
    opacity: 1;
}

.overlay-wrapper .overlayStyleHe {
    height: 0;
    left: 0;
    top: 50%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleHe {
    height: 100%;
    top: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleLi:after {
    height: 100%;
    content: "";
    left: 0;
    top: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleLi:after {
    top: -50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleLi:before {
    bottom: -100%;
    height: 100%;
    content: "";
    left: 0;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleLi:before {
    bottom: -50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleBe:after {
    height: 100%;
    content: "";
    left: 0;
    top: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleBe:after {
    top: 50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleBe:before {
    bottom: -100%;
    height: 100%;
    content: "";
    left: 0;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleBe:before {
    bottom: 50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleB {
    height: 100%;
    left: 50%;
    top: 0;
    width: 0;
}

.overlay-wrapper:hover .overlayStyleB {
    left: 0;
    width: 100%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleC:after {
    height: 100%;
    content: "";
    right: -100%;
    top: 0;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleC:after {
    right: -50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleC:before {
    height: 100%;
    content: "";
    left: -100%;
    top: 0;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleC:before {
    left: -50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleN:after {
    height: 100%;
    content: "";
    right: -100%;
    top: 0;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleN:after {
    right: 50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleN:before {
    height: 100%;
    content: "";
    left: -100%;
    top: 0;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleN:before {
    left: 50%;
    opacity: 1;
}

.overlay-wrapper .overlayStyleO {
    height: 100%;
    left: -100%;
    top: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleO {
    left: 0;
    top: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleF {
    height: 100%;
    right: -100%;
    top: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleF {
    right: 0;
    top: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleNe {
    height: 100%;
    left: -100%;
    bottom: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleNe {
    bottom: 0;
    left: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleNa {
    height: 100%;
    right: -100%;
    bottom: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleNa {
    bottom: 0;
    right: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleMg {
    height: 100%;
    left: 0;
    top: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleMg {
    top: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleAl {
    height: 100%;
    left: 0;
    bottom: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleAl {
    bottom: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleSi {
    height: 100%;
    top: 0;
    right: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleSi {
    right: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleP {
    background: rgba(44, 48, 54, 0.4);
    height: 100%;
    display: block;
    top: 0;
    opacity: 0;
    position: absolute;
    left: -100%;
    width: 100%;
}

.overlay-wrapper:hover .overlayStyleP {
    left: 0;
    opacity: 1;
}

.overlay-wrapper .overlayStyleS {
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-transform: rotate(180deg) scale(0);
    -moz-transform: rotate(180deg) scale(0);
    -ms-transform: rotate(180deg) scale(0);
    -o-transform: rotate(180deg) scale(0);
    transform: rotate(180deg) scale(0);
}

.overlay-wrapper:hover .overlayStyleS {
    -webkit-transform: rotate(0deg) scale(1);
    -moz-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    -o-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity: 1;
}

.overlay-wrapper .overlayStyleCl {
    height: 100%;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-transform: rotate(-180deg) scale(0);
    -moz-transform: rotate(-180deg) scale(0);
    -ms-transform: rotate(-180deg) scale(0);
    -o-transform: rotate(-180deg) scale(0);
    transform: rotate(-180deg) scale(0);
}

.overlay-wrapper:hover .overlayStyleCl {
    -webkit-transform: rotate(0deg) scale(1);
    -moz-transform: rotate(0deg) scale(1);
    -ms-transform: rotate(0deg) scale(1);
    -o-transform: rotate(0deg) scale(1);
    transform: rotate(0deg) scale(1);
    opacity: 1;
}

.overlay-wrapper .overlayStyleArLeft:before {
    content: "";
    top: -50%;
    width: 100%;
    height: 100%;
    left: -100%;
    overflow: hidden;
}

.overlay-wrapper .overlayStyleArLeft:after {
    content: "";
    top: 50%;
    width: 100%;
    height: 100%;
    left: -100%;
    overflow: hidden;
}

.overlay-wrapper .overlayStyleArRight:before {
    content: "";
    top: -50%;
    width: 100%;
    height: 100%;
    right: -100%;
    overflow: hidden;
}

.overlay-wrapper .overlayStyleArRight:after {
    content: "";
    top: 50%;
    width: 100%;
    height: 100%;
    right: -100%;
    overflow: hidden;
}

.overlay-wrapper:hover .overlayStyleArLeft:before,
.overlay-wrapper:hover .overlayStyleArLeft:after {
    opacity: 1;
    left: 50%;
}

.overlay-wrapper:hover .overlayStyleArRight:before,
.overlay-wrapper:hover .overlayStyleArRight:after {
    opacity: 1;
    right: 50%;
}

.overlay-wrapper .overlayStyleK {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    -ms-transform-origin: top left;
    -o-transform-origin: top left;
    transform-origin: top left;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.overlay-wrapper:hover .overlayStyleK {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
}

.overlay-wrapper .overlayStyleCa {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transform-origin: top right;
    -moz-transform-origin: top right;
    -ms-transform-origin: top right;
    -o-transform-origin: top right;
    transform-origin: top right;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.overlay-wrapper:hover .overlayStyleCa {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
}

.overlay-wrapper .overlayStyleSc {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.overlay-wrapper:hover .overlayStyleSc {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
}

.overlay-wrapper .overlayStyleTi {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    -webkit-transform-origin: bottom right;
    -moz-transform-origin: bottom right;
    -ms-transform-origin: bottom right;
    -o-transform-origin: bottom right;
    transform-origin: bottom right;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.overlay-wrapper:hover .overlayStyleTi {
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
    opacity: 1;
}

/*  =============================================
Background Transform
============================================= */
.GrayScale {
    -webkit-filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale");
    /* Firefox 10+, Firefox on Android */
    filter: gray;
    /* IE6-9 */
    -webkit-filter: grayscale(100%);
    /* Chrome 19+, Safari 6+, Safari 6+ iOS */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=60)";
    opacity: .6;
}

.GrayScale:hover {
    -webkit-filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'1 0 0 0 0, 0 1 0 0 0, 0 0 1 0 0, 0 0 0 1 0\'/></filter></svg>#grayscale");
    -webkit-filter: grayscale(0%);
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    opacity: 1;
}

.BackgroundS:hover img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}

.BackgroundRR:hover img {
    -webkit-transform: rotate(-10deg) scale(1.4);
    -moz-transform: rotate(-10deg) scale(1.4);
    -ms-transform: rotate(-10deg) scale(1.4);
    -o-transform: rotate(-10deg) scale(1.4);
    transform: rotate(-10deg) scale(1.4);
}

.BackgroundR:hover img {
    -webkit-transform: rotate(10deg) scale(1.4);
    -moz-transform: rotate(10deg) scale(1.4);
    -ms-transform: rotate(10deg) scale(1.4);
    -o-transform: rotate(10deg) scale(1.4);
    transform: rotate(10deg) scale(1.4);
}

.BackgroundRS img {
    -webkit-transform: scale(1.2);
    -moz-transform: scale(1.2);
    -ms-transform: scale(1.2);
    -o-transform: scale(1.2);
    transform: scale(1.2);
}

.BackgroundRS:hover img {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.BackgroundF:hover img {
    opacity: 0;
}

.BackgroundFS img {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.BackgroundFS:hover img {
    -webkit-transform: scale(10);
    -moz-transform: scale(10);
    -ms-transform: scale(10);
    -o-transform: scale(10);
    transform: scale(10);
    opacity: 0;
}

.BackgroundFRS img {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.BackgroundFRS:hover img {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    opacity: 0;
}

.SquareCircle:hover {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}

.CircleSquare {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    border-radius: 50%;
}

.CircleSquare:hover {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    -ms-border-radius: 0;
    -o-border-radius: 0;
    border-radius: 0;
}

/*  =============================================
Cubic Effects
============================================= */
.overlay-wrapper .CStyleH {
    margin: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    top: 0;
    visibility: hidden;
    width: 100%;
    -webkit-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -moz-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -ms-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -o-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
}

.overlay-wrapper:hover .CStyleH {
    margin-top: -20px;
    opacity: 1;
    top: 50%;
    visibility: visible;
}

.overlay-wrapper .CStyleHe {
    visibility: hidden;
    margin: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    bottom: 0;
    width: 100%;
    -webkit-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -moz-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -ms-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -o-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
}

.overlay-wrapper:hover .CStyleHe {
    margin-bottom: -20px;
    opacity: 1;
    bottom: 50%;
    visibility: visible;
}

.overlay-wrapper .CStyleLi {
    visibility: hidden;
    margin: 0;
    opacity: 0;
    position: absolute;
    text-align: right;
    right: 0;
    width: 100%;
    top: 50%;
    margin-top: -20px;
    -webkit-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -moz-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -ms-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -o-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
}

.overlay-wrapper:hover .CStyleLi {
    margin-right: -42px;
    opacity: 1;
    right: 50%;
    visibility: visible;
}

.overlay-wrapper .CStyleBe {
    visibility: hidden;
    margin: 0;
    opacity: 0;
    position: absolute;
    text-align: left;
    left: 0;
    width: 100%;
    top: 50%;
    margin-top: -20px;
    -webkit-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -moz-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -ms-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -o-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
}

.overlay-wrapper:hover .CStyleBe {
    margin-left: -42px;
    opacity: 1;
    left: 50%;
    visibility: visible;
}

.overlay-wrapper .CStyleB {
    visibility: hidden;
    margin: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    width: 100%;
    top: 50%;
    margin-top: -20px;
    -webkit-transform: scale(0.2);
    -moz-transform: scale(0.2);
    -ms-transform: scale(0.2);
    -o-transform: scale(0.2);
    transform: scale(0.2);
    -webkit-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -moz-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -ms-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    -o-transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
    transition: all 400ms cubic-bezier(1, -0.6, 0.57, -0.15);
}

.overlay-wrapper:hover .CStyleB {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.overlay-wrapper .CStyleC span {
    position: absolute;
}

.overlay-wrapper .CStyleC span:nth-of-type(1) {
    bottom: 50%;
    top: 50%;
    left: 0;
    margin: -20px 0 0 -68px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 400ms cubic-bezier(1, 0, 0.57, 0) !important;
    -webkit-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    -moz-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    -ms-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    -o-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
}

.overlay-wrapper .CStyleC span:nth-of-type(2) {
    bottom: 50%;
    top: 50%;
    left: 50%;
    right: 50%;
    margin: -20px 0 0 -20px;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.overlay-wrapper .CStyleC span:nth-of-type(3) {
    bottom: 50%;
    top: 50%;
    right: 0;
    margin: -20px -68px 0 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 400ms cubic-bezier(1, 0, 0.57, 0) !important;
    -webkit-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    -moz-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    -ms-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    -o-transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
    transition: all 400ms cubic-bezier(1, -0.36, 0.57, -0.15) !important;
}

.overlay-wrapper:hover .CStyleC span:nth-of-type(1) {
    left: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .CStyleC span:nth-of-type(2) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.overlay-wrapper:hover .CStyleC span:nth-of-type(3) {
    right: 50%;
    visibility: visible;
    opacity: 1;
}

/*  =============================================
Button Effects
============================================= */
.overlay-wrapper .StyleH,
.overlay-wrapper .StyleHe,
.overlay-wrapper .StyleLi,
.overlay-wrapper .StyleBe,
.overlay-wrapper .StyleB,
.overlay-wrapper .StyleC,
.overlay-wrapper .StyleN,
.overlay-wrapper .StyleF,
.overlay-wrapper .StyleNe,
.overlay-wrapper .StyleNa,
.overlay-wrapper .StyleCl {
    visibility: hidden;
    margin: 0;
    opacity: 0;
    position: absolute;
    text-align: center;
    margin-top: -20px;
}

.overlay-wrapper .StyleH {
    width: 100%;
    top: 50%;
}

.overlay-wrapper:hover .StyleH {
    opacity: 1;
    visibility: visible;
}

.overlay-wrapper .StyleHe {
    top: 0;
    width: 100%;
}

.overlay-wrapper:hover .StyleHe {
    margin-top: -20px;
    opacity: 1;
    top: 50%;
    visibility: visible;
}

.overlay-wrapper .StyleLi {
    bottom: 0;
    width: 100%;
}

.overlay-wrapper:hover .StyleLi {
    margin-bottom: -20px;
    opacity: 1;
    bottom: 50%;
    visibility: visible;
}

.overlay-wrapper .StyleBe {
    text-align: right;
    right: 0;
    width: 100%;
    top: 50%;
}

.overlay-wrapper:hover .StyleBe {
    margin-right: -42px;
    opacity: 1;
    right: 50%;
    visibility: visible;
}

.overlay-wrapper .StyleB {
    text-align: left;
    left: 0;
    width: 100%;
    top: 50%;
}

.overlay-wrapper:hover .StyleB {
    margin-left: -42px;
    opacity: 1;
    left: 50%;
    visibility: visible;
}

.overlay-wrapper .StyleC {
    width: 100%;
    top: 50%;
    -webkit-transform: scale(0.2);
    -moz-transform: scale(0.2);
    -ms-transform: scale(0.2);
    -o-transform: scale(0.2);
    transform: scale(0.2);
}

.overlay-wrapper:hover .StyleC {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.overlay-wrapper .StyleN {
    width: 100%;
    top: 50%;
    visibility: visible;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

.overlay-wrapper:hover .StyleN {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
}

.overlay-wrapper .StyleO span {
    position: absolute;
}

.overlay-wrapper .StyleO span:nth-of-type(1) {
    bottom: 50%;
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -42px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleO span:nth-of-type(2) {
    bottom: 50%;
    top: 50%;
    right: 50%;
    margin: -20px -42px 0 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleO span:nth-of-type(1) {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
}

.overlay-wrapper:hover .StyleO span:nth-of-type(2) {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotate(360deg);
    -moz-transform: rotate(360deg);
    -ms-transform: rotate(360deg);
    -o-transform: rotate(360deg);
    transform: rotate(360deg);
}

.overlay-wrapper .StyleF {
    visibility: hidden;
    -webkit-transform: scale(0.5) rotateX(360deg);
    -moz-transform: scale(0.5) rotateX(360deg);
    -ms-transform: scale(0.5) rotateX(360deg);
    -o-transform: scale(0.5) rotateX(360deg);
    transform: scale(0.5) rotateX(360deg);
    width: 100%;
    top: 50%;
}

.overlay-wrapper:hover .StyleF {
    opacity: 1;
    -webkit-transform: scale(1) rotateX(0deg);
    -moz-transform: scale(1) rotateX(0deg);
    -ms-transform: scale(1) rotateX(0deg);
    -o-transform: scale(1) rotateX(0deg);
    transform: scale(1) rotateX(0deg);
    visibility: visible;
}

.overlay-wrapper .StyleNe {
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
    width: 100%;
    top: 50%;
}

.overlay-wrapper:hover .StyleNe {
    opacity: 1;
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    transform: rotateY(360deg);
    visibility: visible;
}

.overlay-wrapper .StyleNa {
    -webkit-transform: scale(0.2) rotateY(360deg);
    -moz-transform: scale(0.2) rotateY(360deg);
    -ms-transform: scale(0.2) rotateY(360deg);
    -o-transform: scale(0.2) rotateY(360deg);
    transform: scale(0.2) rotateY(360deg);
    width: 100%;
    top: 50%;
}

.overlay-wrapper:hover .StyleNa {
    opacity: 1;
    -webkit-transform: scale(1) rotateY(0deg);
    -moz-transform: scale(1) rotateY(0deg);
    -ms-transform: scale(1) rotateY(0deg);
    -o-transform: scale(1) rotateY(0deg);
    transform: scale(1) rotateY(0deg);
    visibility: visible;
}

.overlay-wrapper .StyleMg span {
    position: absolute;
}

.overlay-wrapper .StyleMg span:nth-of-type(1) {
    bottom: 50%;
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -82px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleMg span:nth-of-type(2) {
    bottom: 50%;
    top: 50%;
    right: 50%;
    margin: -20px -82px 0 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleMg span:nth-of-type(1) {
    margin: -20px 0 0 -42px;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleMg span:nth-of-type(2) {
    margin: -20px -42px 0 0;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper .StyleAl span {
    position: absolute;
}

.overlay-wrapper .StyleAl span:nth-of-type(1) {
    top: 0;
    left: 50%;
    margin: -20px 0 0 -42px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleAl span:nth-of-type(2) {
    bottom: 0;
    right: 50%;
    margin: 0 -42px -20px 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleAl span:nth-of-type(1) {
    top: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleAl span:nth-of-type(2) {
    bottom: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper .StyleSi span {
    position: absolute;
}

.overlay-wrapper .StyleSi span:nth-of-type(1) {
    bottom: 0;
    left: 50%;
    margin: 0 0 -20px -42px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleSi span:nth-of-type(2) {
    top: 0;
    right: 50%;
    margin: -20px -42px 0 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleSi span:nth-of-type(1) {
    bottom: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleSi span:nth-of-type(2) {
    top: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper .StyleP span {
    position: absolute;
}

.overlay-wrapper .StyleP span:nth-of-type(1) {
    top: 0;
    left: 0;
    margin: -40px 0 0 -40px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleP span:nth-of-type(2) {
    bottom: 0;
    right: 0;
    margin: 0 -40px -40px 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleP span:nth-of-type(1) {
    top: 50%;
    left: 50%;
    margin: -20px 0 0 -42px;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleP span:nth-of-type(2) {
    bottom: 50%;
    right: 50%;
    margin: 0 -42px -20px 0;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper .StyleS span {
    position: absolute;
}

.overlay-wrapper .StyleS span:nth-of-type(1) {
    bottom: 0;
    left: 0;
    margin: -40px 0 0 -40px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleS span:nth-of-type(2) {
    top: 0;
    right: 0;
    margin: 0 -40px -40px 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleS span:nth-of-type(1) {
    bottom: 50%;
    left: 50%;
    margin: 0 0 -20px -42px;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleS span:nth-of-type(2) {
    top: 50%;
    right: 50%;
    margin: -20px -42px 0 0;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper .StyleCl {
    width: 100%;
    top: 50%;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
}

.overlay-wrapper:hover .StyleCl {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateX(360deg);
    -moz-transform: rotateX(360deg);
    -ms-transform: rotateX(360deg);
    -o-transform: rotateX(360deg);
    transform: rotateX(360deg);
}

.overlay-wrapper .StyleAr span {
    position: absolute;
}

.overlay-wrapper .StyleAr span:nth-of-type(1) {
    top: 50%;
    bottom: 50%;
    left: 50%;
    margin: -20px 0 0 -42px;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scale(0.2) rotate(0deg);
    -moz-transform: scale(0.2) rotate(0deg);
    -ms-transform: scale(0.2) rotate(0deg);
    -o-transform: scale(0.2) rotate(0deg);
    transform: scale(0.2) rotate(0deg);
}

.overlay-wrapper .StyleAr span:nth-of-type(2) {
    top: 50%;
    bottom: 50%;
    right: 50%;
    margin: -20px -42px 0 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scale(0.2) rotate(0deg);
    -moz-transform: scale(0.2) rotate(0deg);
    -ms-transform: scale(0.2) rotate(0deg);
    -o-transform: scale(0.2) rotate(0deg);
    transform: scale(0.2) rotate(0deg);
}

.overlay-wrapper:hover .StyleAr span:nth-of-type(1) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1) rotate(360deg);
    -moz-transform: scale(1) rotate(360deg);
    -ms-transform: scale(1) rotate(360deg);
    -o-transform: scale(1) rotate(360deg);
    transform: scale(1) rotate(360deg);
}

.overlay-wrapper:hover .StyleAr span:nth-of-type(2) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1) rotate(360deg);
    -moz-transform: scale(1) rotate(360deg);
    -ms-transform: scale(1) rotate(360deg);
    -o-transform: scale(1) rotate(360deg);
    transform: scale(1) rotate(360deg);
}

.overlay-wrapper .StyleK span {
    position: absolute;
}

.overlay-wrapper .StyleK span:nth-of-type(1) {
    top: 50%;
    bottom: 50%;
    left: 50%;
    margin: -20px 0 0 -42px;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.overlay-wrapper .StyleK span:nth-of-type(2) {
    top: 50%;
    bottom: 50%;
    right: 50%;
    margin: -20px -42px 0 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.overlay-wrapper:hover .StyleK span:nth-of-type(1) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    transform: rotateY(360deg);
}

.overlay-wrapper:hover .StyleK span:nth-of-type(2) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: rotateY(360deg);
    -moz-transform: rotateY(360deg);
    -ms-transform: rotateY(360deg);
    -o-transform: rotateY(360deg);
    transform: rotateY(360deg);
}

.overlay-wrapper .StyleCa span {
    position: absolute;
}

.overlay-wrapper .StyleCa span:nth-of-type(1) {
    top: 50%;
    bottom: 50%;
    left: 50%;
    margin: -20px 0 0 -42px;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scale(0.2) rotateY(0deg);
    -moz-transform: scale(0.2) rotateY(0deg);
    -ms-transform: scale(0.2) rotateY(0deg);
    -o-transform: scale(0.2) rotateY(0deg);
    transform: scale(0.2) rotateY(0deg);
}

.overlay-wrapper .StyleCa span:nth-of-type(2) {
    top: 50%;
    bottom: 50%;
    right: 50%;
    margin: -20px -42px 0 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scale(0.2) rotateY(0deg);
    -moz-transform: scale(0.2) rotateY(0deg);
    -ms-transform: scale(0.2) rotateY(0deg);
    -o-transform: scale(0.2) rotateY(0deg);
    transform: scale(0.2) rotateY(0deg);
}

.overlay-wrapper:hover .StyleCa span:nth-of-type(1) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1) rotateY(360deg);
    -moz-transform: scale(1) rotateY(360deg);
    -ms-transform: scale(1) rotateY(360deg);
    -o-transform: scale(1) rotateY(360deg);
    transform: scale(1) rotateY(360deg);
}

.overlay-wrapper:hover .StyleCa span:nth-of-type(2) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1) rotateY(360deg);
    -moz-transform: scale(1) rotateY(360deg);
    -ms-transform: scale(1) rotateY(360deg);
    -o-transform: scale(1) rotateY(360deg);
    transform: scale(1) rotateY(360deg);
}

.overlay-wrapper .StyleSc span {
    position: absolute;
}

.overlay-wrapper .StyleSc span:nth-of-type(1) {
    bottom: 50%;
    top: 50%;
    left: 0;
    margin: -20px 0 0 -68px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleSc span:nth-of-type(2) {
    top: 0;
    right: 50%;
    left: 50%;
    margin: -20px 0 0 -20px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleSc span:nth-of-type(3) {
    bottom: 50%;
    top: 50%;
    right: 0;
    margin: -20px -68px 0 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleSc span:nth-of-type(1) {
    left: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleSc span:nth-of-type(2) {
    top: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleSc span:nth-of-type(3) {
    right: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper .StyleTi span {
    position: absolute;
}

.overlay-wrapper .StyleTi span:nth-of-type(1) {
    bottom: 50%;
    top: 50%;
    left: 0;
    margin: -20px 0 0 -68px;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper .StyleTi span:nth-of-type(2) {
    bottom: 50%;
    top: 50%;
    left: 50%;
    right: 50%;
    margin: -20px 0 0 -20px;
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.overlay-wrapper .StyleTi span:nth-of-type(3) {
    bottom: 50%;
    top: 50%;
    right: 0;
    margin: -20px -68px 0 0;
    visibility: hidden;
    opacity: 0;
}

.overlay-wrapper:hover .StyleTi span:nth-of-type(1) {
    left: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleTi span:nth-of-type(2) {
    visibility: visible;
    opacity: 1;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.overlay-wrapper:hover .StyleTi span:nth-of-type(3) {
    right: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper .StyleV span {
    position: absolute;
}

.overlay-wrapper .StyleV span:nth-of-type(1) {
    top: 0;
    left: 50%;
    margin: -20px 0 0 -68px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.2s;
    -moz-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.2s;
    -ms-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.2s;
    -o-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.2s;
    transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.2s;
}

.overlay-wrapper .StyleV span:nth-of-type(2) {
    top: 0;
    left: 50%;
    margin: -20px 0 0 -20px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.3s;
    -moz-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.3s;
    -ms-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.3s;
    -o-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.3s;
    transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.3s;
}

.overlay-wrapper .StyleV span:nth-of-type(3) {
    top: 0;
    right: 50%;
    margin: -20px -68px 0 0;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.4s;
    -moz-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.4s;
    -ms-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.4s;
    -o-transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.4s;
    transition: all 200ms cubic-bezier(0, 1.135, 0.73, 1.405) 0.4s;
}

.overlay-wrapper:hover .StyleV span:nth-of-type(1) {
    top: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleV span:nth-of-type(2) {
    top: 50%;
    visibility: visible;
    opacity: 1;
}

.overlay-wrapper:hover .StyleV span:nth-of-type(3) {
    top: 50%;
    visibility: visible;
    opacity: 1;
}

/*  =============================================
Content Transform
============================================= */
.ContentWrapperH .ContentH,
ContentWrapperHe .ContentHe {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
}

.ContentWrapperH:hover .ContentH {
    opacity: 1;
    visibility: visible;
}

.ContentWrapperH .ContentH .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperHe .ContentHe {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.ContentWrapperHe:hover .ContentHe {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.ContentWrapperHe .ContentHe .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperLi:hover img {
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.ContentWrapperLi .ContentLi {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -ms-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
}

.ContentWrapperLi:hover .ContentLi {
    opacity: 1;
    visibility: visible;
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}

.ContentWrapperLi .ContentLi .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperBe img {
    opacity: 1;
}

.ContentWrapperBe:hover img {
    -webkit-transform: scale(10);
    -moz-transform: scale(10);
    -ms-transform: scale(10);
    -o-transform: scale(10);
    transform: scale(10);
    opacity: 0;
}

.ContentWrapperBe .ContentBe {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
}

.ContentWrapperBe:hover .ContentBe {
    opacity: 1;
    visibility: visible;
}

.ContentWrapperBe .ContentBe .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperB:hover img {
    -webkit-transform: translateY(100%);
    -moz-transform: translateY(100%);
    -ms-transform: translateY(100%);
    -o-transform: translateY(100%);
    transform: translateY(100%);
}

.ContentWrapperB .ContentB {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: -100%;
    left: 0;
}

.ContentWrapperB:hover .ContentB {
    opacity: 1;
    visibility: visible;
    top: 0;
}

.ContentWrapperB .ContentB .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperC:hover img {
    -webkit-transform: translateY(-100%);
    -moz-transform: translateY(-100%);
    -ms-transform: translateY(-100%);
    -o-transform: translateY(-100%);
    transform: translateY(-100%);
}

.ContentWrapperC .ContentC {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    bottom: -100%;
    left: 0;
}

.ContentWrapperC:hover .ContentC {
    opacity: 1;
    visibility: visible;
    bottom: 0;
}

.ContentWrapperC .ContentC .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperN:hover img {
    -webkit-transform: translateX(-100%);
    -moz-transform: translateX(-100%);
    -ms-transform: translateX(-100%);
    -o-transform: translateX(-100%);
    transform: translateX(-100%);
}

.ContentWrapperN .ContentN {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    right: -100%;
}

.ContentWrapperN:hover .ContentN {
    opacity: 1;
    visibility: visible;
    right: 0;
}

.ContentWrapperN .ContentN .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperO:hover img {
    -webkit-transform: translateX(100%);
    -moz-transform: translateX(100%);
    -ms-transform: translateX(100%);
    -o-transform: translateX(100%);
    transform: translateX(100%);
}

.ContentWrapperO .ContentO {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: -100%;
}

.ContentWrapperO:hover .ContentO {
    opacity: 1;
    visibility: visible;
    left: 0;
}

.ContentWrapperO .ContentO .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperF:hover img {
    -webkit-transform: translateX(20%);
    -moz-transform: translateX(20%);
    -ms-transform: translateX(20%);
    -o-transform: translateX(20%);
    transform: translateX(20%);
}

.ContentWrapperF .ContentF {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 50%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: perspective(600px) rotateY(90deg);
    -moz-transform: perspective(600px) rotateY(90deg);
    -ms-transform: perspective(600px) rotateY(90deg);
    -o-transform: perspective(600px) rotateY(90deg);
    transform: perspective(600px) rotateY(90deg);
    -webkit-transform-origin: left center 0;
    -moz-transform-origin: left center 0;
    -ms-transform-origin: left center 0;
    -o-transform-origin: left center 0;
    transform-origin: left center 0;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.ContentWrapperF:hover .ContentF {
    opacity: 1;
    visibility: visible;
    -webkit-transform: perspective(600px) rotateY(0deg);
    -moz-transform: perspective(600px) rotateY(0deg);
    -ms-transform: perspective(600px) rotateY(0deg);
    -o-transform: perspective(600px) rotateY(0deg);
    transform: perspective(600px) rotateY(0deg);
}

.ContentWrapperF .ContentF .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperNe:hover img {
    -webkit-transform: translateY(20%);
    -moz-transform: translateY(20%);
    -ms-transform: translateY(20%);
    -o-transform: translateY(20%);
    transform: translateY(20%);
}

.ContentWrapperNe .ContentNe {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 50%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: perspective(600px) rotateX(-90deg);
    -moz-transform: perspective(600px) rotateX(-90deg);
    -ms-transform: perspective(600px) rotateX(-90deg);
    -o-transform: perspective(600px) rotateX(-90deg);
    transform: perspective(600px) rotateX(-90deg);
    -webkit-transform-origin: center top 0;
    -moz-transform-origin: center top 0;
    -ms-transform-origin: center top 0;
    -o-transform-origin: center top 0;
    transform-origin: center top 0;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.ContentWrapperNe:hover .ContentNe {
    opacity: 1;
    visibility: visible;
    -webkit-transform: perspective(600px) rotateX(0deg);
    -moz-transform: perspective(600px) rotateX(0deg);
    -ms-transform: perspective(600px) rotateX(0deg);
    -o-transform: perspective(600px) rotateX(0deg);
    transform: perspective(600px) rotateX(0deg);
}

.ContentWrapperNe .ContentNe .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperNa:hover img {
    -webkit-transform: translateX(-20%);
    -moz-transform: translateX(-20%);
    -ms-transform: translateX(-20%);
    -o-transform: translateX(-20%);
    transform: translateX(-20%);
}

.ContentWrapperNa .ContentNa {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 50%;
    height: 100%;
    display: block;
    top: 0;
    right: 0;
    -webkit-transform: perspective(600px) rotateY(-90deg);
    -moz-transform: perspective(600px) rotateY(-90deg);
    -ms-transform: perspective(600px) rotateY(-90deg);
    -o-transform: perspective(600px) rotateY(-90deg);
    transform: perspective(600px) rotateY(-90deg);
    -webkit-transform-origin: right center 0;
    -moz-transform-origin: right center 0;
    -ms-transform-origin: right center 0;
    -o-transform-origin: right center 0;
    transform-origin: right center 0;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.ContentWrapperNa:hover .ContentNa {
    opacity: 1;
    visibility: visible;
    -webkit-transform: perspective(600px) rotateY(0deg);
    -moz-transform: perspective(600px) rotateY(0deg);
    -ms-transform: perspective(600px) rotateY(0deg);
    -o-transform: perspective(600px) rotateY(0deg);
    transform: perspective(600px) rotateY(0deg);
}

.ContentWrapperNa .ContentNa .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperMg:hover img {
    -webkit-transform: translateY(-20%);
    -moz-transform: translateY(-20%);
    -ms-transform: translateY(-20%);
    -o-transform: translateY(-20%);
    transform: translateY(-20%);
}

.ContentWrapperMg .ContentMg {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 50%;
    display: block;
    bottom: 0;
    left: 0;
    -webkit-transform: perspective(600px) rotateX(90deg);
    -moz-transform: perspective(600px) rotateX(90deg);
    -ms-transform: perspective(600px) rotateX(90deg);
    -o-transform: perspective(600px) rotateX(90deg);
    transform: perspective(600px) rotateX(90deg);
    -webkit-transform-origin: center bottom 0;
    -moz-transform-origin: center bottom 0;
    -ms-transform-origin: center bottom 0;
    -o-transform-origin: center bottom 0;
    transform-origin: center bottom 0;
    -webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;
}

.ContentWrapperMg:hover .ContentMg {
    opacity: 1;
    visibility: visible;
    -webkit-transform: perspective(600px) rotateY(0deg);
    -moz-transform: perspective(600px) rotateY(0deg);
    -ms-transform: perspective(600px) rotateY(0deg);
    -o-transform: perspective(600px) rotateY(0deg);
    transform: perspective(600px) rotateY(0deg);
}

.ContentWrapperMg .ContentMg .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperAl .ContentAl {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: rotateY(0deg) scale(0);
    -moz-transform: rotateY(0deg) scale(0);
    -ms-transform: rotateY(0deg) scale(0);
    -o-transform: rotateY(0deg) scale(0);
    transform: rotateY(0deg) scale(0);
}

.ContentWrapperAl:hover .ContentAl {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateY(360deg) scale(0.9);
    -moz-transform: rotateY(360deg) scale(0.9);
    -ms-transform: rotateY(360deg) scale(0.9);
    -o-transform: rotateY(360deg) scale(0.9);
    transform: rotateY(360deg) scale(0.9);
}

.ContentWrapperAl .ContentAl .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperSi .ContentSi {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: rotateX(0deg) scale(0);
    -moz-transform: rotateX(0deg) scale(0);
    -ms-transform: rotateX(0deg) scale(0);
    -o-transform: rotateX(0deg) scale(0);
    transform: rotateX(0deg) scale(0);
}

.ContentWrapperSi:hover .ContentSi {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateX(360deg) scale(0.9);
    -moz-transform: rotateX(360deg) scale(0.9);
    -ms-transform: rotateX(360deg) scale(0.9);
    -o-transform: rotateX(360deg) scale(0.9);
    transform: rotateX(360deg) scale(0.9);
}

.ContentWrapperSi .ContentSi .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperP .ContentP {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: rotateY(0deg) scale(0.9);
    -moz-transform: rotateY(0deg) scale(0.9);
    -ms-transform: rotateY(0deg) scale(0.9);
    -o-transform: rotateY(0deg) scale(0.9);
    transform: rotateY(0deg) scale(0.9);
}

.ContentWrapperP:hover .ContentP {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateY(360deg) scale(0.9);
    -moz-transform: rotateY(360deg) scale(0.9);
    -ms-transform: rotateY(360deg) scale(0.9);
    -o-transform: rotateY(360deg) scale(0.9);
    transform: rotateY(360deg) scale(0.9);
}

.ContentWrapperP .ContentP .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperS .ContentS {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: rotateX(0deg) scale(0.9);
    -moz-transform: rotateX(0deg) scale(0.9);
    -ms-transform: rotateX(0deg) scale(0.9);
    -o-transform: rotateX(0deg) scale(0.9);
    transform: rotateX(0deg) scale(0.9);
}

.ContentWrapperS:hover .ContentS {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateX(360deg) scale(0.9);
    -moz-transform: rotateX(360deg) scale(0.9);
    -ms-transform: rotateX(360deg) scale(0.9);
    -o-transform: rotateX(360deg) scale(0.9);
    transform: rotateX(360deg) scale(0.9);
}

.ContentWrapperS .ContentS .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperCl {
    overflow: visible !important;
}

.ContentWrapperCl img {
    position: relative;
    z-index: 455;
}

.ContentWrapperCl:hover img {
    -webkit-transform: translateY(-40%);
    -moz-transform: translateY(-40%);
    -ms-transform: translateY(-40%);
    -o-transform: translateY(-40%);
    transform: translateY(-40%);
}

.ContentWrapperCl .ContentCl {
    position: absolute;
    background: #fff;
    opacity: 1;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    bottom: 0;
    left: 0;
    z-index: 200;
}

.ContentWrapperCl:hover .ContentCl {
    visibility: visible;
}

.ContentWrapperCl .ContentCl .Content {
    position: absolute;
    top: 65%;
    display: block;
    width: 100%;
}

.ContentWrapperAr {
    overflow: visible !important;
}

.ContentWrapperAr img {
    position: relative;
    z-index: 455;
}

.ContentWrapperAr:hover img {
    -webkit-transform: translateY(40%);
    -moz-transform: translateY(40%);
    -ms-transform: translateY(40%);
    -o-transform: translateY(40%);
    transform: translateY(40%);
}

.ContentWrapperAr .ContentAr {
    position: absolute;
    background: #fff;
    opacity: 1;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    bottom: 0;
    left: 0;
    z-index: 200;
}

.ContentWrapperAr:hover .ContentAr {
    visibility: visible;
}

.ContentWrapperAr .ContentAr .Content {
    position: absolute;
    top: 5%;
    display: block;
    width: 100%;
}

.ContentWrapperK {
    overflow: visible !important;
}

.ContentWrapperK img {
    position: relative;
    z-index: 455;
}

.ContentWrapperK:hover img {
    -webkit-transform: translateX(-20%);
    -moz-transform: translateX(-20%);
    -ms-transform: translateX(-20%);
    -o-transform: translateX(-20%);
    transform: translateX(-20%);
}

.ContentWrapperK .ContentK {
    position: absolute;
    background: #fff;
    opacity: 1;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    bottom: 0;
    left: 0;
    z-index: 200;
}

.ContentWrapperK:hover .ContentK {
    visibility: visible;
}

.ContentWrapperK .ContentK .Content {
    display: block;
    width: 100%;
    position: relative;
}

.ContentWrapperK .ContentK .Content ul {
    position: absolute;
    top: 0;
    right: 0;
    list-style: none;
}

.ContentWrapperK .ContentK .Content ul li {
    margin: 14px 16px;
}

.ContentWrapperK .ContentK .Content ul li a {
    font-size: 21px;
    color: #5fb6c7;
}

.ContentWrapperCa {
    overflow: visible !important;
}

.ContentWrapperCa img {
    position: relative;
    z-index: 455;
}

.ContentWrapperCa:hover img {
    -webkit-transform: translateX(20%);
    -moz-transform: translateX(20%);
    -ms-transform: translateX(20%);
    -o-transform: translateX(20%);
    transform: translateX(20%);
}

.ContentWrapperCa .ContentCa {
    position: absolute;
    background: #fff;
    opacity: 1;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    bottom: 0;
    left: 0;
    z-index: 200;
}

.ContentWrapperCa:hover .ContentCa {
    visibility: visible;
}

.ContentWrapperCa .ContentCa .Content {
    display: block;
    width: 100%;
    position: relative;
}

.ContentWrapperCa .ContentCa .Content ul {
    position: absolute;
    top: 0;
    left: -20%;
    list-style: none;
    margin: 0;
}

.ContentWrapperCa .ContentCa .Content ul li {
    margin: 14px 16px;
}

.ContentWrapperCa .ContentCa .Content ul li a {
    font-size: 21px;
    color: #5fb6c7;
}

.ContentWrapperSc .ContentSc {
    position: absolute;
    background: #fff;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: -100%;
    left: 0;
}

.ContentWrapperSc:hover .ContentSc {
    visibility: visible;
    top: 0;
}

.ContentWrapperSc .ContentSc .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperTi .ContentTi {
    position: absolute;
    background: #fff;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: -100%;
}

.ContentWrapperTi:hover .ContentTi {
    visibility: visible;
    left: 0;
}

.ContentWrapperTi .ContentTi .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperV .ContentV {
    position: absolute;
    background: #fff;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    right: -100%;
}

.ContentWrapperV:hover .ContentV {
    visibility: visible;
    right: 0;
}

.ContentWrapperV .ContentV .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperCr .ContentCr {
    position: absolute;
    background: #fff;
    visibility: hidden;
    width: 100%;
    height: 0;
    display: block;
    bottom: -100%;
    left: 0;
}

.ContentWrapperCr:hover .ContentCr {
    visibility: visible;
    height: 100%;
    bottom: 0;
}

.ContentWrapperCr .ContentCr .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperMn .ContentMn {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform-origin: top left;
    -moz-transform-origin: top left;
    -ms-transform-origin: top left;
    -o-transform-origin: top left;
    transform-origin: top left;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.ContentWrapperMn:hover .ContentMn {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

.ContentWrapperMn .ContentMn .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperFe .ContentFe {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    right: 0;
    -webkit-transform-origin: top right;
    -moz-transform-origin: top right;
    -ms-transform-origin: top right;
    -o-transform-origin: top right;
    transform-origin: top right;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.ContentWrapperFe:hover .ContentFe {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

.ContentWrapperFe .ContentFe .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperCo .ContentCo {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform-origin: bottom left;
    -moz-transform-origin: bottom left;
    -ms-transform-origin: bottom left;
    -o-transform-origin: bottom left;
    transform-origin: bottom left;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.ContentWrapperCo:hover .ContentCo {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

.ContentWrapperCo .ContentCo .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperNi .ContentNi {
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    right: 0;
    -webkit-transform-origin: bottom right;
    -moz-transform-origin: bottom right;
    -ms-transform-origin: bottom right;
    -o-transform-origin: bottom right;
    transform-origin: bottom right;
    -webkit-transform-style: preserve-3D;
    -moz-transform-style: preserve-3D;
    -ms-transform-style: preserve-3D;
    -o-transform-style: preserve-3D;
    transform-style: preserve-3D;
    -webkit-transform: rotate(180deg);
    -moz-transform: rotate(180deg);
    -ms-transform: rotate(180deg);
    -o-transform: rotate(180deg);
    transform: rotate(180deg);
}

.ContentWrapperNi:hover .ContentNi {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    transform: rotate(0deg);
}

.ContentWrapperNi .ContentNi .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperCu img {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.ContentWrapperCu:hover img {
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.ContentWrapperCu .ContentCu {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: rotateY(180deg);
    -moz-transform: rotateY(180deg);
    -ms-transform: rotateY(180deg);
    -o-transform: rotateY(180deg);
    transform: rotateY(180deg);
}

.ContentWrapperCu:hover .ContentCu {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateY(0deg);
    -moz-transform: rotateY(0deg);
    -ms-transform: rotateY(0deg);
    -o-transform: rotateY(0deg);
    transform: rotateY(0deg);
}

.ContentWrapperCu .ContentCu .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

.ContentWrapperZn img {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
}

.ContentWrapperZn:hover img {
    -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    -ms-transform: rotateX(180deg);
    -o-transform: rotateX(180deg);
    transform: rotateX(180deg);
}

.ContentWrapperZn .ContentZn {
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    backface-visibility: hidden;
    position: absolute;
    background: #fff;
    opacity: 0;
    visibility: hidden;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    left: 0;
    -webkit-transform: rotateX(180deg);
    -moz-transform: rotateX(180deg);
    -ms-transform: rotateX(180deg);
    -o-transform: rotateX(180deg);
    transform: rotateX(180deg);
}

.ContentWrapperZn:hover .ContentZn {
    opacity: 1;
    visibility: visible;
    -webkit-transform: rotateX(0deg);
    -moz-transform: rotateX(0deg);
    -ms-transform: rotateX(0deg);
    -o-transform: rotateX(0deg);
    transform: rotateX(0deg);
}

.ContentWrapperZn .ContentZn .Content {
    position: absolute;
    top: 10%;
    padding: 0 10px;
}

/*  =============================================
Ribbons
============================================= */
.overlay-wrapper .RibbonCTL .Triangle:after {
    border-right: 35px solid rgba(0, 0, 0, 0);
    border-top: 35px solid #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    width: 0;
    top: 0;
    left: 0;
    z-index: 99;
}

.overlay-wrapper .RibbonCTL .Sign {
    top: 2px;
    left: 2px;
    position: absolute;
    z-index: 999;
}

.overlay-wrapper:hover .RibbonCTL {
    opacity: 1;
    visibility: visible;
}

.overlay-wrapper .RibbonCTR .Triangle:after {
    border-left: 35px solid rgba(0, 0, 0, 0);
    border-top: 35px solid #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    width: 0;
    top: 0;
    right: 0;
    z-index: 99;
}

.overlay-wrapper .RibbonCTR .Sign {
    top: 2px;
    right: 2px;
    position: absolute;
    z-index: 999;
}

.overlay-wrapper:hover .RibbonCTR {
    opacity: 1;
    visibility: visible;
}

.overlay-wrapper .RibbonCBL .Triangle:after {
    border-right: 35px solid rgba(0, 0, 0, 0);
    border-bottom: 35px solid #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    width: 0;
    bottom: 0;
    left: 0;
    z-index: 99;
}

.overlay-wrapper .RibbonCBL .Sign {
    bottom: 1px;
    left: 1px;
    position: absolute;
    z-index: 999;
}

.overlay-wrapper .RibbonCTR .Sign a,
.overlay-wrapper .RibbonCTL .Sign a,
.overlay-wrapper .RibbonCBL .Sign a,
.overlay-wrapper .RibbonCBR .Sign a {
    color: #f85050;
}

.overlay-wrapper .RibbonCTR .Sign a:hover,
.overlay-wrapper .RibbonCTL .Sign a:hover,
.overlay-wrapper .RibbonCBL .Sign a:hover,
.overlay-wrapper .RibbonCBR .Sign a:hover {
    color: #d74545;
}

.overlay-wrapper:hover .RibbonCBL {
    opacity: 1;
    visibility: visible;
}

.overlay-wrapper .RibbonCBR .Triangle:after {
    border-left: 35px solid rgba(0, 0, 0, 0);
    border-bottom: 35px solid #fff;
    content: "";
    display: block;
    height: 0;
    position: absolute;
    width: 0;
    bottom: 0;
    right: 0;
    z-index: 99;
}

.overlay-wrapper .RibbonCBR .Sign {
    bottom: 1px;
    right: 1px;
    position: absolute;
    z-index: 999;
}

.overlay-wrapper .RibbonCTL,
.overlay-wrapper .RibbonCTR,
.overlay-wrapper .RibbonCBL,
.overlay-wrapper .RibbonCBR {
    opacity: 0;
    visibility: hidden;
}

.overlay-wrapper:hover .RibbonCBR {
    opacity: 1;
    visibility: visible;
}

/*Global Easing*/
.overlay-wrapper .visible-overlay-wrapper,
.overlay-wrapper .visible-overlay-wrapperCircle,
.overlay-wrapper .overlayStyleH,
.overlay-wrapper .overlayStyleHe,
.overlay-wrapper .overlayStyleLi:after,
.overlay-wrapper .overlayStyleLi:before,
.overlay-wrapper .overlayStyleBe:after,
.overlay-wrapper .overlayStyleBe:before,
.overlay-wrapper .overlayStyleB,
.overlay-wrapper .overlayStyleC:after,
.overlay-wrapper .overlayStyleC:before,
.overlay-wrapper .overlayStyleN:after,
.overlay-wrapper .overlayStyleN:before,
.overlay-wrapper .overlayStyleO,
.overlay-wrapper .overlayStyleF,
.overlay-wrapper .overlayStyleNe,
.overlay-wrapper .overlayStyleNa,
.overlay-wrapper .overlayStyleMg,
.overlay-wrapper .overlayStyleAl,
.overlay-wrapper .overlayStyleSi,
.overlay-wrapper .overlayStyleP,
.overlay-wrapper .overlayStyleS,
.overlay-wrapper .overlayStyleCl,
.overlay-wrapper .overlayStyleArLeft:before,
.overlay-wrapper .overlayStyleArLeft:after,
.overlay-wrapper .overlayStyleArRight:before,
.overlay-wrapper .overlayStyleArRight:after,
.overlay-wrapper .overlayStyleK,
.overlay-wrapper .overlayStyleCa,
.overlay-wrapper .overlayStyleSc,
.overlay-wrapper .overlayStyleTi,
.GrayScale,
.BackgroundS img,
.BackgroundRR img,
.BackgroundR img,
.BackgroundRS img,
.BackgroundF img,
.BackgroundFS img,
.BackgroundFRS img,
.SquareCircle,
.CircleSquare {
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.overlay-wrapper .CStyleC span:nth-of-type(2),
.overlay-wrapper .StyleH,
.overlay-wrapper .StyleHe,
.overlay-wrapper .StyleLi,
.overlay-wrapper .StyleBe,
.overlay-wrapper .StyleB,
.overlay-wrapper .StyleC,
.overlay-wrapper .StyleN,
.overlay-wrapper .StyleO span:nth-of-type(1),
.overlay-wrapper .StyleO span:nth-of-type(2),
.overlay-wrapper .StyleF,
.overlay-wrapper .StyleNe,
.overlay-wrapper .StyleNa,
.overlay-wrapper .StyleMg span:nth-of-type(1),
.overlay-wrapper .StyleMg span:nth-of-type(2),
.overlay-wrapper .StyleAl span:nth-of-type(1),
.overlay-wrapper .StyleAl span:nth-of-type(2),
.overlay-wrapper .StyleSi span:nth-of-type(1),
.overlay-wrapper .StyleSi span:nth-of-type(2),
.overlay-wrapper .StyleP span:nth-of-type(1),
.overlay-wrapper .StyleP span:nth-of-type(2),
.overlay-wrapper .StyleS span:nth-of-type(1),
.overlay-wrapper .StyleS span:nth-of-type(2),
.overlay-wrapper .StyleCl,
.overlay-wrapper .StyleAr span:nth-of-type(1),
.overlay-wrapper .StyleAr span:nth-of-type(2),
.overlay-wrapper .StyleK span:nth-of-type(1),
.overlay-wrapper .StyleK span:nth-of-type(2),
.overlay-wrapper .StyleCa span:nth-of-type(1),
.overlay-wrapper .StyleCa span:nth-of-type(2),
.overlay-wrapper .StyleSc span:nth-of-type(1),
.overlay-wrapper .StyleSc span:nth-of-type(2),
.overlay-wrapper .StyleSc span:nth-of-type(3),
.overlay-wrapper .StyleTi span:nth-of-type(1),
.overlay-wrapper .StyleTi span:nth-of-type(2),
.overlay-wrapper .StyleTi span:nth-of-type(3) {
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.ContentWrapperTi .ContentTi,
.ContentWrapperCl .ContentCl,
.ContentWrapperH .ContentH,
.ContentWrapperHe .ContentHe,
.ContentWrapperLi img,
.ContentWrapperLi .ContentLi,
.ContentWrapperBe img,
.ContentWrapperBe .ContentBe,
.ContentWrapperB img,
.ContentWrapperB .ContentB,
.ContentWrapperC img,
.ContentWrapperC .ContentC,
.ContentWrapperN img,
.ContentWrapperN .ContentN,
.ContentWrapperO img,
.ContentWrapperO .ContentO,
.ContentWrapperF img,
.ContentWrapperF .ContentF,
.ContentWrapperNe img,
.ContentWrapperNe .ContentNe,
.ContentWrapperNa img,
.ContentWrapperNa .ContentNa,
.ContentWrapperMg img,
.ContentWrapperMg .ContentMg,
.ContentWrapperAl .ContentAl,
.ContentWrapperSi .ContentSi,
.ContentWrapperP .ContentP,
.ContentWrapperS .ContentS,
.ContentWrapperCl img,
.ContentWrapperAr img,
.ContentWrapperAr .ContentAr,
.ContentWrapperK img,
.ContentWrapperK .ContentK,
.ContentWrapperCa img,
.ContentWrapperCa .ContentCa,
.ContentWrapperSc .ContentSc,
.ContentWrapperV .ContentV,
.ContentWrapperCr .ContentCr,
.ContentWrapperMn .ContentMn,
.ContentWrapperFe .ContentFe,
.ContentWrapperCo .ContentCo,
.ContentWrapperNi .ContentNi,
.ContentWrapperCu img,
.ContentWrapperCu .ContentCu,
.ContentWrapperZn img,
.ContentWrapperZn .ContentZn,
.overlay-wrapper .RibbonCTL,
.overlay-wrapper .RibbonCTR,
.overlay-wrapper .RibbonCBL,
.overlay-wrapper .RibbonCBR {
    -webkit-transition: all 0.3s ease 0s;
    -moz-transition: all 0.3s ease 0s;
    -ms-transition: all 0.3s ease 0s;
    -o-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

/*  =============================================
Transparent Background
============================================= */
.TBlack {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8) !important;
}

.TWhite {
    background: none repeat scroll 0 0 rgba(255, 255, 255, 0.8) !important;
}

.overlay-wrapper h4 {
    margin: 0;
    margin-bottom: 5px;
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    div.chrome-fix {
        width: 99.99999% !important;
    }
}