.tsvg-cp-block-view {
display: inline-block;
overflow: hidden;
position: relative;
text-align: center;
cursor: default;
box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
max-width: 100% !important;
}
.tsvg-cp-block-view .mask,
.tsvg-cp-block-view .content {
position: absolute;
overflow: hidden;
top: 0;
left: 0;
width: 100%;
}
.tsvg-cp-block-view img {
display: block;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
margin: 0 !important;
}
.tsvg-cp-block-view h2 {
position: relative;
margin-top: 10px !important;
padding: 3px !important;
line-height: 1 !important;
}
.tsvg-cp-block-view p {
position: relative;
padding: 0px 10px;
}
.tsvg-cp-block-view a.tsvg-cp-block-info-link {
display: inline-block;
text-decoration: none;
margin: 0 auto;
padding-left: 7px;
padding-right: 7px;
} .tsvg-cp-block-view-ninth .mask-1,
.tsvg-cp-block-view-ninth .mask-2 {
height: 1200px;
width: 1200px;
-webkit-transition: all 0.3s ease-in-out 0.6s;
-moz-transition: all 0.3s ease-in-out 0.6s;
-o-transition: all 0.3s ease-in-out 0.6s;
transition: all 0.3s ease-in-out 0.6s;
}
.tsvg-cp-block-view-ninth .mask-1 {
left: auto;
right: 0;
-webkit-transform: rotate(56.5deg) translateX(-360px);
-moz-transform: rotate(56.5deg) translateX(-360px);
-o-transform: rotate(56.5deg) translateX(-360px);
-ms-transform: rotate(56.5deg) translateX(-360px);
transform: rotate(56.5deg) translateX(-360px);
-webkit-transform-origin: 100% 0%;
-moz-transform-origin: 100% 0%;
-o-transform-origin: 100% 0%;
-ms-transform-origin: 100% 0%;
transform-origin: 100% 0%;
}
.tsvg-cp-block-view-ninth .mask-2 {
top: auto;
bottom: 0;
-webkit-transform: rotate(56.5deg) translateX(360px);
-moz-transform: rotate(56.5deg) translateX(360px);
-o-transform: rotate(56.5deg) translateX(360px);
-ms-transform: rotate(56.5deg) translateX(360px);
transform: rotate(56.5deg) translateX(360px);
-webkit-transform-origin: 0% 100%;
-moz-transform-origin: 0% 100%;
-o-transform-origin: 0% 100%;
-ms-transform-origin: 0% 100%;
transform-origin: 0% 100%;
}
.tsvg-cp-block-view-ninth .content {
height: 0;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
filter: alpha(opacity=50);
opacity: 0.5;
width: 100%;
overflow: hidden;
-webkit-transform: rotate(-33.5deg) translate(-112px, 166px);
-moz-transform: rotate(-33.5deg) translate(-112px, 166px);
-o-transform: rotate(-33.5deg) translate(-112px, 166px);
-ms-transform: rotate(-33.5deg) translate(-112px, 166px);
transform: rotate(-33.5deg) translate(-112px, 166px);
-webkit-transform-origin: 0% 100%;
-moz-transform-origin: 0% 100%;
-o-transform-origin: 0% 100%;
-ms-transform-origin: 0% 100%;
transform-origin: 0% 100%;
-webkit-transition: all 0.4s ease-in-out 0.3s;
-moz-transition: all 0.4s ease-in-out 0.3s;
-o-transition: all 0.4s ease-in-out 0.3s;
transition: all 0.4s ease-in-out 0.3s;
}
.tsvg-cp-block-view-ninth h2 {
background: transparent;
margin-top: 5px;
}
.tsvg-cp-block-view-ninth:hover .content {
height: 100%;
width: 100%;
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=90)";
filter: alpha(opacity=90);
opacity: 0.9;
-webkit-transform: rotate(0deg) translate(0, 0);
-moz-transform: rotate(0deg) translate(0, 0);
-o-transform: rotate(0deg) translate(0, 0);
-ms-transform: rotate(0deg) translate(0, 0);
transform: rotate(0deg) translate(0, 0);
}
.tsvg-cp-block-view-ninth:hover .mask-1,
.tsvg-cp-block-view-ninth:hover .mask-2 {
-webkit-transition-delay: 0s;
-moz-transition-delay: 0s;
-o-transition-delay: 0s;
transition-delay: 0s;
}
.tsvg-cp-block-view-ninth:hover .mask-1 {
-webkit-transform: rotate(55.5deg) translateX(5px);
-moz-transform: rotate(55.5deg) translateX(5px);
-o-transform: rotate(55.5deg) translateX(5px);
-ms-transform: rotate(55.5deg) translateX(5px);
transform: rotate(55.5deg) translateX(5px);
}
.tsvg-cp-block-view-ninth:hover .mask-2 {
-webkit-transform: rotate(55.5deg) translateX(-5px);
-moz-transform: rotate(55.5deg) translateX(-5px);
-o-transform: rotate(55.5deg) translateX(-5px);
-ms-transform: rotate(55.5deg) translateX(-5px);
transform: rotate(55.5deg) translateX(-5px);
}