.tm-sc-animated-layer-advanced {
position: relative;
max-width: 100%;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper {
position: relative;
display: block;
width: inherit;
max-width: 100%;
height: inherit;
max-height: 100%;
background-size: cover;
background-repeat: no-repeat;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper:not(:first-child) {
position: absolute;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-text {
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-text {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-text img {
margin: 0;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-text:after {
content: "";
height: 100%;
left: 0;
position: absolute;
top: 0;
width: 100%;
z-index: -1;
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-text:after {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-blank > * {
width: 100%;
height: 100%;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image {
transition: all 1s ease;
transition-delay: 700ms;
display: inline-block;
position: relative;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper {
overflow: hidden;
position: relative;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-shine:before {
position: absolute;
top: 0;
left: -100%;
display: block;
content: "";
width: 50%;
height: 100%;
background: -o-linear-gradient(left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
background: -webkit-gradient(linear, left top, right top, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, 0.3)));
background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.3) 100%);
-webkit-transform: skewX(-25deg);
-ms-transform: skewX(-25deg);
transform: skewX(-25deg);
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-shine:before {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-shine:hover:before {
-webkit-animation: shine 1s;
animation: shine 1s;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-circle:before {
position: absolute;
top: 50%;
left: 50%;
display: block;
content: "";
width: 0;
height: 0;
background: rgba(255, 255, 255, 0.2);
border-radius: 100%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
opacity: 0;
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-circle:before {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-circle:hover:before {
-webkit-animation: image-hover-circle 0.75s;
animation: image-hover-circle 0.75s;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-grayscale img {
-webkit-filter: grayscale(100%);
filter: grayscale(100%);
-webkit-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-grayscale:hover img {
-webkit-filter: grayscale(0);
filter: grayscale(0);
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-sepia img {
-webkit-filter: sepia(100%);
filter: sepia(100%);
-webkit-transition: 0.3s ease-in-out;
transition: 0.3s ease-in-out;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-image .layer-image-inner-wrapper.image-hover-effect-sepia:hover img {
-webkit-filter: sepia(0);
filter: sepia(0);
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.box-shadow-around-img {
box-shadow: 0px 0px 40px rgba(5, 5, 5, 0.15);
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-image-fullwidth .layer-image {
display: block;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-image-fullwidth img {
width: 100%;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon {
width: 80px;
height: 80px;
line-height: 80px;
border-radius: 50%;
background: var(--theme-color1);
text-align: center;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon:before {
position: absolute;
content: "";
width: 140px;
height: 140px;
background: url(//redhatprep.com/wp-content/plugins/mascot-core/assets/images/icon-box/dotted-border.png) no-repeat center;
left: -30px;
top: -30px;
-webkit-animation: spin 10s linear infinite;
-moz-animation: spin 10s linear infinite;
animation: spin 10s linear infinite;
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon:before {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon .icon {
width: 48px;
opacity: 1;
visibility: visible;
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon .icon {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon .icon-hover {
width: 48px;
opacity: 0;
visibility: hidden;
position: absolute;
left: 50%;
top: 50%;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon .icon-hover {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon:hover .icon {
opacity: 0;
visibility: hidden;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper .layer-animated-icon:hover .icon-hover {
opacity: 1;
visibility: visible;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-play-btn .video-play-button {
transition: all 0.3s ease;
}
@media (prefers-reduced-motion: reduce) {
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-play-btn .video-play-button {
transition: none;
}
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-play-btn .video-play-button .icon {
display: flex;
justify-content: center;
align-items: center;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-play-btn .video-play-button .effect-wrapper {
height: 100%;
}
.tm-sc-animated-layer-advanced .animated-layer-advanced-inner .layer-image-wrapper.layer-play-btn .video-play-button .effect-wrapper .icon {
height: 100%;
}
@-webkit-keyframes image-hover-circle {
0% {
opacity: 1;
}
40% {
opacity: 1;
}
100% {
width: 200%;
height: 200%;
opacity: 0;
}
}
@keyframes image-hover-circle {
0% {
opacity: 1;
}
40% {
opacity: 1;
}
100% {
width: 200%;
height: 200%;
opacity: 0;
}
}.feature-current-item-style1 {
position: relative;
margin-bottom: 30px;
z-index: 1;
}
.feature-current-item-style1 .inner-box {
position: relative;
display: flex;
border: 1px solid var(--theme-color1);
background: #fff;
border-radius: 10px;
overflow: hidden;
height: 100%;
transition: all 300ms ease;
box-shadow: 0 10px 60px rgba(0, 0, 0, 0.07);
}
.feature-current-item-style1 .inner-box:hover {
box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
transform: translateY(-10px);
}
.feature-current-item-style1 .inner-box:hover img {
transform: scale(1.2);
}
.feature-current-item-style1 .inner-box:hover .icon-box .count {
color: #fff;
}
.feature-current-item-style1 .icon-box {
position: relative;
background-color: var(--theme-color1);
min-width: 110px;
text-align: center;
padding: 25px 15px;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.feature-current-item-style1 .icon-box .icon i {
display: block;
color: #ffffff;
font-size: 64px;
line-height: 64px;
transition: all 300ms ease;
}
@media (prefers-reduced-motion: reduce) {
.feature-current-item-style1 .icon-box .icon i {
transition: none;
}
}
.feature-current-item-style1 .icon-box .count {
font-size: 40px;
line-height: 1em;
color: var(--theme-color1);
color: transparent;
-webkit-text-stroke-width: 0.5px;
-webkit-text-stroke-color: #fff;
transition: all 300ms ease;
}
@media (prefers-reduced-motion: reduce) {
.feature-current-item-style1 .icon-box .count {
transition: none;
}
}
.feature-current-item-style1 .content-box {
position: relative;
padding: 25px 30px;
}
.feature-current-item-style1 .content-box .icon-box-title {
margin-top: 0;
margin-bottom: 18px;
}
.feature-current-item-style1 .content-box .icon-box-title a {
transition: all 300ms ease;
}
@media (prefers-reduced-motion: reduce) {
.feature-current-item-style1 .content-box .icon-box-title a {
transition: none;
}
}
.feature-current-item-style1 .content-box .text {
font-size: 16px;
line-height: 26px;
color: #767676;
}
.feature-current-item-style2 {
position: relative;
text-align: center;
margin-bottom: 30px;
-webkit-transition: all 500ms ease;
transition: all 500ms ease;
}
.feature-current-item-style2 .inner-box {
position: relative;
display: block;
border: 1px solid #322d3b;
padding: 30px;
background-color: var(--theme-color2);
transition: all 500ms ease;
}
@media (prefers-reduced-motion: reduce) {
.feature-current-item-style2 .inner-box {
transition: none;
}
}
.feature-current-item-style2 .inner-box .icon-box {
position: relative;
display: block;
}
.feature-current-item-style2 .inner-box .icon-box .icon i {
position: relative;
display: inline-block;
font-size: 64px;
color: var(--theme-color1);
line-height: 1;
margin-bottom: 15px;
line-height: 1;
}
.feature-current-item-style2 .inner-box .feature-title {
margin-bottom: 20px;
margin-top: 0;
color: #fff;
transition: all 500ms ease;
}
@media (prefers-reduced-motion: reduce) {
.feature-current-item-style2 .inner-box .feature-title {
transition: none;
}
}
.feature-current-item-style2 .inner-box .feature-details {
font-size: 14px;
color: #aea8b9;
line-height: 24px;
transition: all 500ms ease;
}
@media (prefers-reduced-motion: reduce) {
.feature-current-item-style2 .inner-box .feature-details {
transition: none;
}
}
.feature-current-item-style2 .inner-box:hover {
-webkit-transform: translateY(-10px);
transform: translateY(-10px);
border: 1px solid #f0eeee;
background-color: #fff;
}
.feature-current-item-style2 .inner-box:hover .icon-box .icon {
color: var(--theme-color1);
}
.feature-current-item-style2 .inner-box:hover .feature-title {
color: #1b1525;
}
.feature-current-item-style2 .inner-box:hover .feature-details {
color: var(--body-tex);
}
.feature-current-item-style3 {
position: relative;
margin-bottom: 45px !important;
}
@media (max-width: 991.98px) {
.feature-current-item-style3 {
margin-bottom: 0 !important;
}
}
@media (max-width: 767.98px) {
.feature-current-item-style3 {
margin-bottom: 40px !important;
}
}
.feature-current-item-style3 .inner-box {
position: relative;
padding-left: 130px;
background-color: #ffffff;
}
@media (max-width: 767.98px) {
.feature-current-item-style3 .inner-box {
padding-top: 0;
}
}
@media (max-width: 575.98px) {
.feature-current-item-style3 .inner-box {
padding-left: 0 !important;
padding-right: 0 !important;
text-align: center !important;
}
}
.feature-current-item-style3 .inner-box .icon-box {
position: absolute;
left: 0;
top: 0;
text-align: center;
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
@media (max-width: 575.98px) {
.feature-current-item-style3 .inner-box .icon-box {
position: relative;
display: block;
margin-bottom: 30px;
}
}
.feature-current-item-style3 .inner-box .icon-box .icon {
position: relative;
display: block;
}
@media (max-width: 575.98px) {
.feature-current-item-style3 .inner-box .icon-box .icon {
display: inline-flex;
}
}
.feature-current-item-style3 .inner-box .icon-box .icon i {
height: 100px;
width: 100px;
font-size: 62px;
line-height: 50px;
color: #ffffff;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
background-color: var(--theme-color3);
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.feature-current-item-style3 .inner-box .icon-box .icon i:before {
-webkit-transition: all 300ms ease;
transition: all 300ms ease;
}
.feature-current-item-style3 .inner-box .icon-box .icon:after {
position: absolute;
left: 100%;
top: 50%;
border-top: 20px solid transparent;
border-left: 10px solid var(--theme-color3);
border-bottom: 20px solid transparent;
content: "";
margin-top: -20px;
}
@media (max-width: 575.98px) {
.feature-current-item-style3 .inner-box .icon-box .icon:after {
top: 100% !important;
left: 50% !important;
transform: rotate(90deg);
margin-top: -15px !important;
margin-left: -2px !important;
}
}
.feature-current-item-style3 .inner-box .feature-title {
position: relative;
display: inline-block;
font-size: 20px;
font-family: var(--body-font-family);
font-weight: 700;
margin-bottom: 10px;
margin-top: 0;
}
.feature-current-item-style3 .inner-box .feature-title:before {
position: absolute;
left: 100%;
top: 0;
height: 16px;
width: 95px;
background-image: url(//redhatprep.com/wp-content/plugins/mascot-core-tronis/assets/images/current-theme/arrow.png);
background-position: center;
margin-left: 35px;
content: "";
}
@media (max-width: 991.98px) {
.feature-current-item-style3 .inner-box .feature-title:before {
display: none;
}
}
.feature-current-item-style3 .inner-box .feature-details {
position: relative;
display: block;
font-size: 16px;
line-height: 30px;
color: #898e83;
}
.feature-current-item-style3 .inner-box:hover .icon-box {
top: -40px;
}
@media (max-width: 991.98px) {
.feature-current-item-style3 .inner-box:hover .icon-box {
top: 0;
}
}
.feature-current-item-style3 .inner-box:hover .icon-box .icon i:before {
-webkit-transform: scale(-1) rotate(180deg);
transform: scale(-1) rotate(180deg);
}
.feature-current-item-style4 {
position: relative;
margin-bottom: 30px;
}
.feature-current-item-style4 .inner-box {
position: relative;
padding: 30px 20px 20px;
text-align: center;
min-height: 180px;
border-radius: 10px;
box-shadow: 0 5px 40px rgba(0, 0, 0, 0.07);
background-color: #ffffff;
overflow: hidden;
transition: all 300ms ease;
}
.feature-current-item-style4 .inner-box:hover {
box-shadow: 0 25px 30px rgba(0, 0, 0, 0.07);
}
.feature-current-item-style4 .inner-box:hover .icon:after {
top: -10px;
}
.feature-current-item-style4 .icon {
position: relative;
font-size: 64px;
line-height: 1em;
color: var(--theme-color2);
display: block;
margin-bottom: 5px;
transition: all 300ms ease;
}
.feature-current-item-style4 .icon i {
z-index: 2;
position: relative;
color: var(--theme-color1);
}
.feature-current-item-style4 .icon:before {
position: relative;
z-index: 2;
}
.feature-current-item-style4 .icon:after {
position: absolute;
content: "";
right: 0;
left: 0;
margin: 0 auto;
top: -73px;
height: 86px;
width: 86px;
border-radius: 50% 50%;
background-color: #f7f4f0;
transition: all 300ms ease;
}
.feature-current-item-style4 .title {
font-size: 18px;
color: var(--theme-color1);
font-weight: 700;
}
.feature-current-item-style4 .title a {
color: var(--theme-color1);
}
.feature-current-item-style4 .title a:hover {
color: var(--theme-color2);
}