/home/moonrcjl/public_html/wp/wp-content/themes/arsha/assets/scss/layout/pages/_cta.scss
@use "../../utils" as *;
/*----------------------------------------*/
/* 7.1 about css start
/*----------------------------------------*/
.mtcta {
&__bg {
position: absolute;
top: 0;
left: 0;
width: 50%;
height: 100%;
bottom: 0;
@media #{$md,$xs} {
position: static;
width: 100%;
margin-top: -40px;
margin-bottom: 60px;
}
& img {
width: 100%;
height: 100%;
object-fit: cover;
}
}
&__item {
@media #{$md,$xs} {
flex-wrap: wrap;
}
}
&__btn {
position: relative;
& a {
width: 160px;
height: 160px;
line-height: 180px;
border-radius: 100%;
background: var(--mt-common-black);
color: var(--mt-common-white);
font-size: 16px;
display: inline-block;
text-align: center;
& span {
position: absolute;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
& i {
@include transform(rotate(-45deg));
font-size: 20px;
@include transition(0.5s);
}
}
&:hover {
color: var(--mt-common-white);
}
}
}
&__border {
border-bottom: 1px solid var(--mt-border-3);
}
&__2 {
& .mtcta__subtitle {
color: #c6f906;
font-size: 16px;
font-family: var(--mt-ff-body);
}
& .mtcta__title {
font-size: 150px;
line-height: 1;
color: var(--mt-common-white);
@media #{$md} {
font-size: 110px;
}
@media #{$xs} {
font-size: 75px;
}
}
}
}