/home/moonrcjl/public_html/wp/wp-content/themes/arsha/assets/scss/layout/pages/_fact.scss
@use "../../utils" as *;
/*----------------------------------------*/
/* 7.1 Fact css start
/*----------------------------------------*/
.mtfact {
&__item {
padding: 60px 50px;
border: 1px solid rgba(255, 255, 255, 0.14);
@include transition(.4s);
margin-right: -1px;
margin-top: -50px;
@media #{$lg, $md, $xs} {
margin-top: -31px;
}
&:hover {
background: var(--mt-theme-1);
border-color: var(--mt-theme-1);
& .mtfact__count {
color: var(--mt-common-black);
}
& .mtfact__number {
color: var(--mt-common-black);
}
& .mtfact__content {
& p {
color: var(--mt-common-black);
}
}
}
&-2 {
background-color: #fcd782;
padding: 32px;
&:hover {
& img {
// -webkit-filter: brightness(0) invert(1);
// filter: brightness(1) invert(1);
}
}
& img {
@include transition(.5s);
overflow: hidden;
}
& .mtfact__count {
font-size: 62px;
font-weight: 700;
color: var(--mt-common-black);
}
& p {
font-size: 24px;
font-weight: 500;
margin-top: -25px;
color: var(--mt-common-black);
}
}
}
&__wrap {
z-index: 2;
position: relative;
}
&__count {
color: var(--mt-common-white);
font-size: 52px;
@include transition(.4s);
}
&__number {
font-size: 20px;
color: var(--mt-common-white);
@include transition(.4s);
}
&__content {
& p {
color: rgba(255, 255, 255, 0.8);
@include transition(.4s);
}
}
&__white{
& .mtfact{
&__item{
border: 1px solid var(--mt-border-1);
margin-top: 0px;
}
&__count{
color: var(--mt-common-black);
}
&__content{
& span{
color: var(--mt-common-black);
}
& p {
color: var(--mt-common-black);
}
}
}
}
}