Файловый менеджер - Редактировать - /home/digitalm/tendeverona/wp-content/themes/trydo/assets/scss/elements/_service.scss
Назад
/*========================== Service Area ===========================*/ .rn-service-area { .section-title { &.text-left { p { padding: 0; margin-bottom: 15px; } } } } /* Bg Color Variation */ .single-service { .icon { svg { width: 54px; height: 54px; } } h3 { &.title { @media #{$lg-layout} { font-size: 22px; } } } // Service Style One &.service__style--1 { padding: 40px 0; @extend %transition; @extend %posrelative; z-index: 2; @media #{$sm-layout} { padding: 15px 0; } @media #{$md-layout} { padding: 20px 0; } .icon { font-size: 54px; font-weight: 400; margin-bottom: 23px; display: inline-flex; color: var(--color-primary); @extend %transition; svg { stroke-width: 1 !important; } img { margin-bottom: 34px; } } .content { .title { margin-bottom: 19px; font-weight: 400; @extend %transition; font-size: 24px; @media #{$lg-layout} { font-size: 22px; } @media #{$md-layout} { font-size: 22px; } @media #{$sm-layout} { font-size: 18px; } a { color: inherit; } } p { @extend %transition; color: #717173; } } &.text-white { z-index: 2; .content { h3 { &.title { color: #c6c9d8; } } p { color: #c6c9d8; } } } } &.service__style--2 { @extend %posrelative; a { display: block; @extend %transition; } @media #{$md-layout} { padding: 30px 25px; } @media #{$sm-layout} { padding: 35px 25px; } @media #{$large-mobile} { margin-top: 30px; } .icon { font-size: 54px; font-weight: 400; margin-bottom: 23px; display: inline-flex; color: var(--color-primary); @extend %transition; @media #{$large-mobile} { color: #ffffff; } svg { stroke-width: 1 !important; } } .content { .title { margin-bottom: 19px; font-weight: 500; @extend %transition; font-size: 24px; @media #{$large-mobile} { color: #ffffff; } @media #{$lg-layout} { font-size: 20px; margin-bottom: 14px; } @media #{$md-layout} { font-size: 22px; } @media #{$sm-layout} { font-size: 18px; margin-bottom: 14px; } a { color: inherit; @media #{$large-mobile} { color: #ffffff; } } } p { @extend %transition; color: #717173; font-size: 18px; line-height: 30px; @media #{$sm-layout} { font-size: 16px; line-height: 28px; } @media #{$large-mobile} { color: #ffffff; } } } &:hover { a { transform: translateY(-5px); } .icon { color: #ffffff; } .content { .title { @extend %textwhite; } p { @extend %textwhite; } } } &.service-left-align { display: flex; padding: 50px 24px; .icon { padding-right: 20px; } } a { padding: 60px 45px; z-index: 2; border-radius: 10px; @media #{$sm-layout} { padding: 60px 14px; } @media #{$lg-layout} { padding: 50px 11px; } @media #{$md-layout} { padding: 60px 25px; } &::before { position: absolute; content: ""; left: 0; top: 0; background-image: linear-gradient(to right, #f61b10, #ef0963); width: 100%; height: 100%; z-index: -1; opacity: 0; visibility: hidden; @extend %transition; border-radius: 10px; @media #{$large-mobile} { opacity: 1; visibility: visible; } } } &.bg-color-gray { margin-top: 0; height: 100%; @media #{$lg-layout} { padding: 0; } @media #{$md-layout} { padding: 0; } @media #{$sm-layout} { padding: 0; } a { display: flex; height: 100%; background: #f6f6f6; position: relative; @media #{$lg-layout} { padding: 33px 22px; } @media #{$md-layout} { padding: 35px 20px; } @media #{$sm-layout} { padding: 35px 20px; } } } &:hover { a { box-shadow: 0 10px 25px 10px rgba(0, 0, 0, 0.1); &::before { opacity: 1; visibility: visible; } } &.bg-color-gray { a { background: transparent; } } } } &.service__style--3 { padding: 40px 0; @extend %transition; @extend %posrelative; z-index: 2; margin-top: 50px; @media #{$sm-layout} { padding: 15px 0; margin-top: 0; } @media #{$md-layout} { padding: 20px 0; } .icon { font-size: 54px; font-weight: 400; display: inline-flex; color: var(--color-primary); img { margin-bottom: 30px; @media #{$sm-layout} { margin-bottom: 20px; } @media #{$large-mobile} { margin-bottom: 13px; height: 45px; } } } .content { .title { margin-bottom: 15px; font-weight: 400; font-size: 24px; @media #{$lg-layout} { font-size: 22px; } @media #{$md-layout} { font-size: 22px; } @media #{$sm-layout} { font-size: 18px; margin-bottom: 14px; } @media #{$large-mobile} { color: #ffffff; } } p { opacity: .75; font-weight: 300; color: #c6c9d8; font-size: 18px; line-height: 30px; @media #{$sm-layout} { font-size: 16px; line-height: 28px; } } } &.text-white { z-index: 2; .content { h3 { &.title { color: #c6c9d8; } } p { color: #c6c9d8; } } } } // Service Style Four &.service__style--4, &.service__style--5{ padding: 30px 38px; z-index: 2; border-radius: 10px; position: relative; @extend %transition; cursor: pointer; @media #{$lg-layout} { padding: 20px 20px; } @media #{$md-layout} { padding: 30px 25px; } @media #{$sm-layout} { padding: 20px 20px; } &.large-size { padding: 60px 45px; @media #{$lg-layout} { padding: 25px 20px; } @media #{$md-layout} { padding: 30px 25px; } @media #{$sm-layout} { padding: 25px 20px; } } &::before { position: absolute; content: ""; left: 0; top: 0; background-image: -webkit-gradient(linear,left top,right top,from(#f61b10),to(#ef0963)); background-image: -webkit-linear-gradient(left,#f61b10,#ef0963); background-image: linear-gradient(90deg,#f61b10,#ef0963); width: 100%; height: 100%; z-index: -1; opacity: 0; visibility: hidden; border-radius: 10px; @extend %transition; @media #{$large-mobile} { opacity: 1; visibility: visible; } } a{ display: block; transition: 0.3s; } .icon { display: inline-flex; font-size: 54px; font-weight: 400; margin-bottom: 23px; display: inline-flex; color: var(--color-primary); @extend %transition; @media #{$sm-layout} { margin-bottom: 18px; } @media #{$large-mobile} { color: #fff; } svg { stroke-width: 1 !important; } } .content { .title { margin-bottom: 19px; font-weight: 500; @extend %transition; font-size: 24px; line-height: 1.4074; @media #{$large-mobile} { color: #fff; } @media #{$lg-layout} { font-size: 22px; } @media #{$md-layout} { font-size: 22px; } @media #{$sm-layout} { font-size: 18px; margin-bottom: 10px; } } p { @extend %transition; font-size: 18px; line-height: 30px; @media #{$sm-layout} { font-size: 16px; line-height: 28px; } @media #{$large-mobile} { color: #fff; } } } &:hover { box-shadow: 0 10px 25px 10px rgba(0,0,0,.1); -webkit-transform: translateY(-5px); transform: translateY(-5px); &::before { opacity: 1; visibility: visible; } .icon { color: #fff; } .content { .title { color: #fff; } p { color: #fff; } a { color: #fff; } } } } &.service__style--5 { } } .service_stylefour-large { .service__style--4 { padding: 60px 45px; @media #{$lg-layout} { padding: 25px 20px; } @media #{$md-layout} { padding: 30px 25px; } @media #{$sm-layout} { padding: 25px 20px; } } } /*--------------------------- Paralax Service Style -----------------------------*/ .rn-paralax-service { .service__style--2 { z-index: 2; padding: 40px 40px; background: rgba(255, 255, 255, 0.3); margin-top: 40px; overflow: hidden; border: 2px solid transparent; @media #{$sm-layout} { padding: 30px 20px; background: transparent; margin-top: 30px; } .icon { color: #ffffff; } .content { h3 { &.title { font-size: 19px; color: #ffffff; } } p { font-size: 18px; line-height: 30px; @media #{$sm-layout} { font-size: 16px; line-height: 28px; } } } &:hover { border: 2px solid var(--color-primary); &::before { border-radius: 0; } } } } .service-one-wrapper { @media #{$md-layout} { margin: 0 -40px; } @media #{$sm-layout} { margin: 0 -40px; } @media #{$large-mobile} { margin: 0 -15px; } } .standard-service { margin: 30px 0; .content { margin-top: 30px; } .thumbnai { img { border-radius: 5px; width: 100%; } } } .corporate-business-banner { .slide { &.slide-style-2 { padding-top: 0; @media #{$lg-layout} { padding-top: 0; padding-bottom: 0; } @media #{$md-layout} { padding-top: 0; padding-bottom: 0; } @media #{$sm-layout} { padding-top: 0; padding-bottom: 0; } } } } .service-area--5 .section-title{ margin-bottom: 5px; } .single-service.service__style--5 { box-shadow: 0 25px 70px rgba(0, 0, 0, 0.07); background: #fff; padding: 40px; border-radius: 5px; } .single-service.service__style--5::before { border-radius: 5px; } .single-service.service__style--5 .service{ display: flex; } .single-service.service__style--5 .icon { margin-right: 30px; } .single-service.service__style--5 .content p { font-size: 16px; } .contact-us-today .single-service.service__style--5 { cursor: default; } @media #{$lg-layout} { .contact-us-today .single-service.service__style--5 .service { display: block; } .contact-us-today .single-service.service__style--5 { padding: 30px; } } @media #{$md-layout} { .single-service.service__style--5 .service { display: block; } .single-service.service__style--5 { padding: 30px; } .contact-us-today .single-service.service__style--5 .service { display: block; } .contact-us-today .single-service.service__style--5 { padding: 30px 17px; } .contact-us-today .single-service.service__style--5 .content p { font-size: 14px; } .contact-us-today .single-service.service__style--5 .icon { margin-right: 0; margin-bottom: 15px; } } @media #{$sm-layout} { .single-service.service__style--5 .service { display: block; } .single-service.service__style--5 { padding: 30px; } .contact-us-today .single-service.service__style--5 .service { display: block; } .contact-us-today .single-service.service__style--5 { padding: 30px 17px; } .contact-us-today .single-service.service__style--5 .content p { font-size: 14px; } .contact-us-today .single-service.service__style--5 .icon { margin-right: 0; margin-bottom: 15px; } } @media #{$large-mobile} { .contact-us-today .single-service.service__style--5 .content p a { color: #fff; } }
| ver. 1.4 |
Github
|
.
| PHP 8.3.23 | Генерация страницы: 0.04 |
proxy
|
phpinfo
|
Настройка