File manager - Edit - /home/verseaumee/blueversion/wp-content/plugins/motors-wpbakery-widgets/assets/css/stm_hero_banner.css
Back
.stm-hero-banner-wrap { display: block; position: relative; width: 100%; } .stm-hero-banner-wrap .stm-image-wrap { display: block; width: 100%; margin: auto 0; overflow: hidden; max-height: 600px; } .stm-hero-banner-wrap .stm-image-wrap img { display: block; width: 100%; min-height: 600px; -o-object-fit: cover; object-fit: cover; transform: scale(1, 1); transition: all 0.3s ease-in-out; } @media (max-width: 767px) { .stm-hero-banner-wrap .stm-image-wrap img { min-height: 400px; } } .stm-hero-banner-wrap:hover .stm-image-wrap img { transform: scale(1.01, 1.01); } .stm-hero-banner-wrap .container { position: absolute; top: 0; bottom: 0; left: 0; right: 0; display: flex; flex-direction: row; flex-wrap: nowrap; align-items: center; } .stm-hero-banner-wrap .container .stm-info-wrap { -webkit-backface-visibility: hidden; backface-visibility: hidden; } .stm-hero-banner-wrap .container .stm-info-wrap .stm-hb-round { -webkit-backface-visibility: hidden; backface-visibility: hidden; } @media (max-width: 767px) { .stm-hero-banner-wrap .container .stm-info-wrap .stm-hb-round .stm-button { padding: 14px 18px 12px; } } .stm-hero-banner-wrap.left .container { justify-content: flex-start; } .stm-hero-banner-wrap.right .container { justify-content: flex-end; } .stm-hero-banner-wrap.style_1 .stm-info-wrap { display: inline-block; z-index: 5; transition: all 0.3s ease-in-out; width: 359px; height: 359px; position: relative; } @media (max-width: 1199px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap { margin: 0 15px; } } @media (max-width: 767px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap { width: 280px; height: 280px; } } @media (max-width: 320px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap { margin-left: 5px; } } .stm-hero-banner-wrap.style_1 .stm-info-wrap:after { position: absolute; content: ""; display: block; top: -18px; left: -18px; right: -18px; bottom: -18px; border-radius: 50%; opacity: 0.25; z-index: -1; transform: scale(1, 1); transition: all 0.5s ease-in-out; } .stm-hero-banner-wrap.style_1 .stm-info-wrap:hover:after { transform: scale(1.05, 1.05); opacity: 0.5; } .stm-hero-banner-wrap.style_1 .stm-info-wrap:hover .stm-hb-round:after { opacity: 1; } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round { width: 100%; height: 100%; z-index: 5; color: rgb(255, 255, 255); text-decoration: none; white-space: normal; text-align: left; line-height: 20px; letter-spacing: 0px; font-weight: 400; padding: 58px 19px 50px 27px; border-radius: 50%; transform-origin: 50% 50%; opacity: 1; transform: translate(0px, 0px); } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round:after { position: absolute; content: ""; display: block; top: 0; left: 0; right: 0; bottom: 0; border-radius: 50%; opacity: 0.85; z-index: -1; transition: all 0.5s ease-in-out; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round { display: flex; flex-direction: column; justify-content: center; align-items: flex-start; } } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-title { font-weight: 700; color: rgb(35, 38, 40); padding-left: 37px; padding-right: 45px; line-height: 1.1; } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-title span { display: block; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-title { font-size: 16px; padding: 0; } } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: flex-start; letter-spacing: 0px; font-weight: 400; } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit > span { display: inline-block; position: relative; } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-currency { font-weight: 600; color: #fff; vertical-align: top; justify-content: space-between; line-height: 1; } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-price { text-align: left; letter-spacing: -6px; font-weight: 700; line-height: 0.7; vertical-align: top; color: #fff; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-price { letter-spacing: 0; } } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-divider { position: relative; left: 6px; color: #232628; line-height: 1; margin: 0 5px 0 3px; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-divider { line-height: 30px; font-size: 26px; top: 0; left: 0; padding: 0 6px; } } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels { display: flex; flex-direction: column; align-items: flex-start; justify-content: flex-start; flex-wrap: nowrap; max-width: 100px; vertical-align: top; color: #232628; font-weight: 700; padding: 0 0 0 5px; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels { padding: 0; } } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-label { display: block; text-transform: uppercase; line-height: 0.7; margin-bottom: 5px; } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-value { display: block; white-space: normal; word-spacing: 0; text-transform: uppercase; padding-left: 3px; line-height: 0.9; } .stm-hero-banner-wrap.style_1 .stm-info-wrap .stm-hb-round .stm-button { margin-left: 37px; } .stm-hero-banner-wrap.style_2 .stm-info-wrap { display: inline-block; z-index: 5; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round { z-index: 5; color: rgb(255, 255, 255); text-decoration: none; line-height: 20px; letter-spacing: 0px; font-weight: 400; font-size: 34px; opacity: 1; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-title { color: rgb(35, 38, 40); font-weight: 400; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-title { font-size: 26px; } } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; font-weight: 700; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-currency { color: #cc6119; vertical-align: top; line-height: 1; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-price { text-align: left; color: #cc6119; line-height: 0.73; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-divider { position: relative; left: 6px; color: #FFFFFF; line-height: 1; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-divider { left: 4px; } } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: nowrap; vertical-align: top; color: #ffffff; font-weight: 700; padding-left: 6px; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-label { display: block; text-transform: uppercase; line-height: 1; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-value { display: block; white-space: normal; word-spacing: 0; text-transform: uppercase; max-width: 70px; text-align: left; margin-left: 15px; line-height: 1; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-value { margin-left: 3px; } } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-hb-round-text { letter-spacing: 0; font-weight: 400; margin-top: 11px; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-button { margin-top: 12px; font-weight: 600; } .stm-hero-banner-wrap.style_2 .stm-info-wrap .stm-hb-round .stm-button i { font-size: 18px; vertical-align: middle; } .stm-hero-banner-wrap.style_2.right .stm-info-wrap .stm-hb-round { text-align: right; } .stm-hero-banner-wrap.style_2.right .stm-info-wrap .stm-hb-round .stm-hb-title { text-align: right; } .stm-hero-banner-wrap.style_2.right .stm-info-wrap .stm-hb-round .stm-hb-price-unit { justify-content: flex-end; } .stm-hero-banner-wrap.style_2.right .stm-info-wrap .stm-hb-round .stm-hb-round-text { text-align: right; } .stm-hero-banner-wrap.style_2.left .stm-info-wrap .stm-hb-round { text-align: left; } .stm-hero-banner-wrap.style_2.left .stm-info-wrap .stm-hb-round .stm-hb-title { text-align: left; } .stm-hero-banner-wrap.style_2.left .stm-info-wrap .stm-hb-round .stm-hb-price-unit { justify-content: flex-start; } .stm-hero-banner-wrap.style_2.left .stm-info-wrap .stm-hb-round .stm-hb-round-text { text-align: left; } .stm-hero-banner-wrap.style_3 .stm-info-wrap { display: block; cursor: pointer; padding: 55px 40px; color: #ffffff; max-width: 540px; overflow: hidden; position: relative; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_3 .stm-info-wrap { padding: 30px; } } .stm-hero-banner-wrap.style_3 .stm-info-wrap:after { position: absolute; content: ""; display: block; top: 0; left: 0; right: 0; bottom: 0; opacity: 0.5; z-index: -1; transform: scale(1, 1); transition: all 0.5s ease-in-out; } .stm-hero-banner-wrap.style_3 .stm-info-wrap:hover:after { opacity: 0.75; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-title { text-decoration: none; letter-spacing: -1px; line-height: 1; font-weight: 700; color: #ffffff; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-title span.stm-white { color: rgb(255, 177, 41); } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit { display: flex; flex-direction: row; flex-wrap: nowrap; align-items: flex-start; color: #ffffff; font-weight: 500; margin: 13px 0; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-currency { line-height: 1; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-price { line-height: 0.7; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-divider { line-height: 1; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels { display: flex; flex-direction: row; align-items: center; justify-content: flex-start; flex-wrap: nowrap; vertical-align: top; color: #ffffff; font-weight: 700; padding-left: 6px; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-label { display: block; text-transform: uppercase; line-height: 1; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-value { display: block; white-space: normal; word-spacing: 0; text-transform: uppercase; max-width: 70px; text-align: left; margin-left: 10px; line-height: 1; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-price-unit .stm-hb-labels .stm-hb-time-value { margin-left: 3px; } } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-hb-round-text { color: #ffffff; font-weight: 500; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-button { margin-top: 12px; font-weight: 600; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-button i { font-size: 18px; vertical-align: middle; } @media (max-width: 767px) { .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-button { line-height: 40px; } .stm-hero-banner-wrap.style_3 .stm-info-wrap .stm-hb-round .stm-button i { font-size: 16px; line-height: 14px; } } .stm-hero-banner-wrap.loaded .container .stm-info-wrap { -webkit-animation-name: opacity; animation-name: opacity; -webkit-animation-fill-mode: forwards; animation-fill-mode: forwards; -webkit-animation-delay: 0.2s; animation-delay: 0.2s; -webkit-animation-duration: 0.3s; animation-duration: 0.3s; } @-webkit-keyframes slidein { from { opacity: 0; margin-left: -100%; } to { opacity: 1; margin-left: 0; } } @keyframes slidein { from { opacity: 0; margin-left: -100%; } to { opacity: 1; margin-left: 0; } } @-webkit-keyframes opacity { from { opacity: 0; } to { opacity: 1; } } @keyframes opacity { from { opacity: 0; } to { opacity: 1; } }
| ver. 1.4 |
Github
|
.
| PHP 8.5.7 | Generation time: 0 |
proxy
|
phpinfo
|
Settings