Untitled
unknown
plain_text
a year ago
55 kB
3
Indexable
/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/
h1,h2,h3,h4,h5,h6 {
font-family: $font-heading;
margin: 0;
clear: both;
font-weight: 700;
color: $headingcolor;
}
.page-content h3,
.page-content h2 {
margin-bottom: 10px;
}
h1 {
font-size: 42px;
line-height: 1.3;
}
h2 {
font-size: 36px;
line-height: 1.3;
}
h3 {
font-size: 28px;
line-height: 1.3;
}
h4 {
font-size: 20px;
line-height: 1.4;
}
h5 {
font-size: 18px;
line-height: 1.3;
}
h6 {
font-size: 1px;
line-height: 1.2;
}
.xpo-main-title {
font-size: 48px;
font-weight: 900;
}
.xpo-main-title32 {
font-size: 32px;
font-weight: 900;
}
.xpo-main-title36 {
font-size: 36px;
font-weight: 900;
}
.xpo-main-title42 {
font-size: 42px;
font-weight: 900;
}
.xpo-main-title44 {
font-size: 44px;
font-weight: 900;
}
.xpo-main-title64 {
font-size: 64px;
font-weight: 900;
}
.xpo-main-title54 {
font-size: 54px;
font-weight: 900;
}
.xpo-title22 {
font-size: 22px;
}
.xpo-title24 {
font-size: 24px;
}
.xpo-title20 {
font-size: 20px;
}
.xpo-title18 {
font-size: 18px;
}
.xpo-title16 {
font-size: 16px;
}
.xpo-title14 {
font-size: 14px;
}
.xpo-title12 {
font-size: 12px;
}
strong {
font-weight: 900;
}
.xpo-mb10 {
margin-bottom: 10px;
}
.xpo-mb15 {
margin-bottom: 15px;
}
.xpo-mb20 {
margin-bottom: 20px;
}
.xpo-mb25 {
margin-bottom: 25px;
}
.xpo-mb30 {
margin-bottom: 30px;
}
.xpo-mb40 {
margin-bottom: 40px;
}
.xpo-mb50 {
margin-bottom: 50px;
}
.xpo-mb60 {
margin-bottom: 60px;
}
.xpo-mb80 {
margin-bottom: 80px;
}
.xpo-mb100 {
margin-bottom: 100px;
}
.xpo-mt20 {
margin-top: 20px;
}
.xpo-mt40 {
margin-top: 40px;
}
.xpo-mt60 {
margin-top: 60px;
}
.xpo-mtp100 {
margin-top: 100px;
}
.xpo-space-pt150 {
padding-top: 150px;
}
.xpo-space-pt130 {
padding-top: 130px;
}
.xpo-pb-100 {
padding-bottom: 100px;
}
.xpo-pb-60 {
padding-bottom: 60px;
}
.xpo-single-content .wp-block-embed iframe {
width: 100%;
}
.xpo-icon-close {
position: relative;
&:after,
&:before {
content: "";
position: absolute;
left: 0;
right: 0;
height: 14px;
width: 2px;
transform: rotate(-45deg);
background: red;
margin-top: -7px;
}
&:after {
transform: rotate(45deg);
}
&:before {
transform: rotate(-45deg);
}
}
.xpo-icon-yes {
position: relative;
&:before {
content: "";
position: absolute;
background-color: transparent;
left: 0;
margin-top: -7px;
width: 8px;
border-bottom: 2px solid $primarycolor;
height: 12px;
border-right: 2px solid $primarycolor;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
}
.xpo-icon-yes2 {
height: 30px;
position: relative;
width: 30px;
background: #dfece7;
display: inline-block;
border-radius: 100px;
&:before {
content: "";
position: absolute;
background-color: transparent;
left: 11px;
margin-top: 6px;
width: 8px;
border-bottom: 2px solid $greencolor;
height: 14px;
border-right: 2px solid $greencolor;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
}
.xpo-icon-close2 {
height: 30px;
position: relative;
width: 30px;
background: #f1e3e3;
display: inline-block;
border-radius: 100px;
&:after,
&:before {
content: "";
position: absolute;
left: 14px;
right: 0;
height: 14px;
width: 2px;
transform: rotate(-45deg);
background: $redcolor;
margin-top: 8px;
}
&:after {
transform: rotate(45deg);
}
&:before {
transform: rotate(-45deg);
}
}
.xpo-arrow-right {
border: solid #fff;
border-width: 0 2px 2px 0;
display: inline-block;
padding: 3px;
transform: rotate(-45deg);
-webkit-transform: rotate(-45deg);
}
.image-left-100 {
margin-right: -100px;
}
.xpo-width1000 {
max-width: 1000px;
margin-left: auto;
margin-right: auto;
}
.xpo-width960 {
max-width: 960px;
margin-left: auto;
margin-right: auto;
}
.xpo-width930 {
max-width: 930px;
margin-left: auto;
margin-right: auto;
}
.xpo-width850 {
max-width: 850px;
margin-left: auto;
margin-right: auto;
}
.xpo-width700 {
max-width: 700px;
margin-left: auto;
margin-right: auto;
}
.xpo-width750 {
max-width: 750px;
margin-left: auto;
margin-right: auto;
}
.xpo-width780 {
max-width: 780px;
margin-left: auto;
margin-right: auto;
}
.xpo-width800 {
max-width: 800px;
margin-left: auto;
margin-right: auto;
}
.xpo-title-header {
max-width: 750px;
margin: 0 auto 50px;
.xpo-btn {
display: inline-block;
margin-top: 35px;
}
}
.xpo-btn-video {
a.xpo-video-popup {
display: inline-block;
justify-content: center;
}
}
.xpo-video-popup-icon {
position: relative;
padding-right: 25px;
&::before {
content: "";
border-radius: 100%;
position: absolute;
top: -1px;
left: 0;
padding: 10px;
border: 2px solid $primarycolor;
}
&:after {
content: "";
position: absolute;
border-top: 5px solid transparent;
border-left: 8px solid $postxcolor;
border-bottom: 5px solid transparent;
top: 6px;
left: 9px;
}
}
body {
margin: 0;
padding: 0;
background: #F5F7F9;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
overflow-x: hidden;
background-position: top center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
font-family: $font-body;
font-size: $font-size-base;
line-height: $line-height-base;
color: $bodycolor2;
font-weight: 400;
}
.single.single-post {
background: #fff;
}
a {
text-decoration: none;
transition: 400ms;
color: $primarycolor;
}
p {
margin-bottom: 10px;
}
dfn, cite, em, i {
font-style: italic;
}
blockquote {
margin: 0 1.5em;
}
address {
margin: 0 0 1.5em;
}
.wp-block-quote {
&.is-style-large {
margin: 40px 0;
padding: 40px;
background: #fff;
border-radius: 5px;
border: 1px solid rgba(229, 229, 229, .7);
box-shadow: 10px 30px 70px 0 rgba(0, 0, 0, .1);
> p {
margin-bottom: 0;
}
}
}
.wp-block-pullquote {
margin: 30px 0;
padding: 2em 0;
blockquote {
> p {
margin-bottom: 0;
}
}
}
.xpo-waring {
background-color: #fff3cd;
color: #664d03;
border-left: 4px solid #ffe69c;
padding: 10px 15px;
line-height: 1.5;
font-size: 16px;
border-radius: 4px;
}
.xpo-success {
background-color: #d1e7dd;
color: #156e46;
border-left: 4px solid #a3cfbb;
padding: 10px 15px;
line-height: 1.5;
font-size: 16px;
border-radius: 4px;
}
pre {
background: #fff;
border: 1px solid rgba(229, 229, 229, .7);
box-shadow: 10px 30px 70px 0 rgba(0, 0, 0, .1);
font-size: 18px;
line-height: 1.6;
max-width: 100%;
overflow: auto;
padding: 1.6em;
font-family: $font-body;
border-radius: 5px;
&.wp-block-code {
padding: 30px;
border-radius: 0;
background: #ffffff;
background: -moz-linear-gradient(top, #ffffff 50%, #fafafa 50%);
background: -webkit-linear-gradient(top, #ffffff 50%,#fafafa 50%);
border-radius: 4px;
// background: -o-linear-gradient(top, #ffffff 50%,#fafafa 50%);
// background: linear-gradient(top, #ffffff 50%,#fafafa 50%);
background-size: 32px 37px;
font-size: 18px;
line-height: 34px;
border: 1px solid rgba(229, 229, 229, .7);
box-shadow: 10px 30px 70px 0 rgba(0, 0, 0, .1);
margin-top: 25px;
transition: 400ms;
font-family: $font-body;
white-space: pre-wrap;
&:hover {
box-shadow: 0 5px 10px 0 rgba(141,141,141,.3);
}
}
}
code, kbd, tt, var {
font-size: 16px;
white-space: pre-wrap;
}
abbr, acronym {
border-bottom: 1px dotted #666;
cursor: help;
}
mark, ins {
background: #fff9c0;
text-decoration: none;
}
big {
font-size: 125%;
}
/* button */
.btn {
padding: 10px 25px;
}
.xpo-orange {
color: $orangecolor;
}
.xpo-green {
color: $greencolor;
}
.xpo-red {
color: $redcolor;
}
.xpo-pink {
color: $pinkcolor;
}
.xpo-cyn {
color: $cyncolor;
}
.xpo-yellow {
color: $yellowcolor;
}
.xpo-yellow2 {
color: $yellowcolo2;
}
.xpo-main-color {
color: $primarycolor;
}
.xpo-gcolor {
color: $metacolor;
}
.xpo-bcolor2 {
color: $bodycolor2;
}
.xpo-bcolor {
color: $bodycolor;
}
.xpo-productx-color {
color: $productxcolor;
}
.xpo-white {
color: #fff;
.xpo-main-title {
color: #fff;
}
}
.xpo-card {
padding: 30px;
box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.12);
background: #fff;
border-radius: 4px;
.xpo-btn {
display: inline-block;
margin-top: 30px;
}
span {
display: block;
}
h3 {
font-size: 28px;
margin-bottom: 15px;
}
h4 {
font-size: 20px;
margin-bottom: 10px;
}
img {
margin-bottom: 12px;
}
&.xpo-primary-card {
background: $primarycolor;
color: #fff;
box-shadow: 0 20px 20px -15px rgba(20, 155, 255, 0.3);
h3 {
color: #fff;
}
}
}
.xpo-info-box {
display: flex;
flex-wrap: wrap;
&.xpo-center {
justify-content: center;
align-items: center;
}
img {
width: 80px;
}
h4 {
width: 100%;
}
}
.xpo-info-box2 {
img {
margin-bottom: 25px;
}
h4 {
margin-bottom: 12px;
padding: 0 15px;
}
div {
padding: 0 15px;
color: $metacolor;
}
}
.xpo-whitebg {
background: #fff;
}
.xpo-blackbg {
background: $headingcolor;
}
.xpo-productxbg {
background: $productxcolor;
}
.xpo-gradientbg {
background-color: #e4c9e4;
background-image: linear-gradient( 133deg,#e4c9e4 0,#ffe8c9 100%);
}
.xpo-pink-gradientbg {
background-color: #FFE4E3;
background-image: linear-gradient(180deg, #FFE4E3 60%, #F0F2F4 100%);
}
.xpo-container-gray-gradient {
background-image: linear-gradient(180deg, #DADFE5 12%, #F0F2F4 100%);
}
.xpo-yellow-gradientbg {
background-image: linear-gradient(180deg, #E9E5BA 0%, #F0F2F4 99%);
}
.xpo-green-gradientbg {
background-image: linear-gradient(180deg, #A0EADE 0%, #F0F2F4 98%);
}
.xpo-violet-gradientbg {
background-image: linear-gradient(180deg, #DEC0E3 0%, #F0F2F4 100%);
}
.xpo-stories {
background-image: linear-gradient(133deg, #F8DBD7 0%, #FFF2E1 100%);
}
.xpo-red-green-gradientbg {
background-image: linear-gradient(133deg,#ffd7ce 0,#affff3 100%);
}
.xpo-graybg {
background: $graycolor;
}
.xpo-primarybg {
background: $primarycolor;
}
.xpo-section-padding {
padding-top: 100px;
padding-bottom: 100px;
}
.xpo-section-padding80 {
padding-top: 80px;
padding-bottom: 80px;
}
.xpo-section-space {
margin-bottom: 100px;
}
.xpo-layout-title-wrap {
&.xpo-title-header {
max-width: 850px;
display: flex;
flex-wrap: wrap;
align-items: center;
.xpo-layout-title {
max-width: 600px;
.xpo-sub-title {
max-width: 100%;
margin-right: 60px;
max-width: 100%;
}
+ div {
margin-left: auto;
}
}
.xpo-btn {
margin-top: 0;
margin-left: auto;
}
}
}
.left-half-circle,
.xpo-compare-wrapper,
.xpo-productx-overview,
.xpo-category-wrapper,
.xpo-landing-info,
.xpo-feature-wrapper,
.xpo-core-feature-wrapper,
.xpo-productx-cta-testimonial {
position: relative;
&:after {
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
background-repeat: no-repeat;
}
.xpo-container,
.xpo-title-header {
position: relative;
z-index: 1;
}
}
.left-half-circle,
.right-wishlist-img,
.xpo-layout-wrapper,
.xpo-compare-bg,
.xpo-productx-cta-testimonial {
position: relative;
&:before {
right: 0;
top: 0;
position: absolute;
content: "";
background-repeat: no-repeat;
}
.xpo-container,
.xpo-title-header {
position: relative;
z-index: 1;
}
}
.xpo-productx-cta-testimonial {
&:after {
width: 96px;
height: 81px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/left-quote.png');
left: 70px;
top: 40px
}
}
.left-half-circle {
&:after {
width: 241px;
height: 233px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/half-circle.png');
}
}
.xpo-landing-info {
&:after {
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/no-coding-bg.png');
background-size: 1500px auto;
background-position: center 50px;
}
}
.xpo-feature-wrapper {
&:after {
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/exclusive-feature-bg.png');
background-size: 1200px auto;
background-position: center;
background-repeat: repeat;
opacity: 0.7;
}
}
.xpo-core-feature-wrapper {
&:after {
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/core-feature-bg.png');
background-size: 1500px auto;
background-position: center;
background-repeat: no-repeat;
}
}
.xpo-compare-wrapper {
&:after {
width: 240px;
height:421px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/compare-icon-min.png');
}
}
.xpo-productx-overview {
&:after {
top: 60px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/gift-icon-img.png');
width: 318px;
height: 343px;
background-size: cover;
}
}
.xpo-category-wrapper {
&:after {
left: 100px;
width:833px;
height: 394px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/circle-img2.png');
background-size: cover;
}
}
.xpo-productx-cta-testimonial {
&:before {
width: 99px;
height: 81px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/right-quotation.png');
top: auto;
bottom: 60px;
right: 60px;
}
}
.left-half-circle {
&:before {
right: 60px;
top: 60px;
width: 150px;
height: 150px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/cirlce.png');
}
}
.right-wishlist-img {
&:before {
width: 341px;
height: 322px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/wishlist-icon-bg.png');
background-size: cover;
}
}
.xpo-layout-wrapper {
&:before {
width: 340px;
height: 480px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/rectangle-icon.png');
background-size: cover;
}
}
.xpo-compare-bg {
&:before {
width: 342px;
height: 305px;
background-image: url('https://www.wpxpo.com/wp-content/uploads/2021/03/product-slider-icon.png');
background-size: cover;
}
.xpo-core-feature {
position: relative;
z-index: 1;
}
}
/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
html {
line-height: 1.15; /* 1 */
-webkit-text-size-adjust: 100%; /* 2 */
box-sizing: border-box;
margin-top: 0;
}
*,
*:before,
*:after {
/* Inherit box-sizing to make it easier to change the property for components that leverage other behavior; see https://css-tricks.com/inheriting-box-sizing-probably-slightly-better-best-practice/ */
box-sizing: inherit;
}
.xpo-video {
width: 100%;
}
hr {
background-color: #ccc;
border: 0;
height: 1px;
margin-bottom: 1.5em;
}
ul, ol {
margin: 0 0 1.5em 3em;
}
ul {
list-style: disc;
}
ol {
list-style: decimal;
}
li > ul,
li > ol {
margin-bottom: 0;
margin-left: 1.5em;
}
dt {
font-weight: bold;
}
dd {
margin: 0 1.5em 1.5em;
}
img {
height: auto;
/* Make sure images are scaled correctly. */
max-width: 100%;
/* Adhere to container width. */
}
table {
margin: 0 0 1.5em;
width: 100%;
}
/* Screen Reader Text ------------------------ */
.screen-reader-text {
border: 0;
clip: rect(1px, 1px, 1px, 1px);
-webkit-clip-path: inset(50%);
clip-path: inset(50%);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute !important;
width: 1px;
word-wrap: normal !important;
word-break: normal;
&:focus {
background-color: #f1f1f1;
border-radius: 3px;
box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
clip: auto !important;
-webkit-clip-path: none;
clip-path: none;
color: $primarycolor;
display: block;
font-size: 0.875rem;
font-weight: 700;
height: auto;
right: 5px;
line-height: normal;
padding: 15px 23px 14px;
text-decoration: none;
top: 5px;
width: auto;
z-index: 100000;
}
}
.xpo-iframe-video {
padding-bottom: 56.25%;
position: relative;
iframe {
max-width: 100%;
margin: 0;
line-height: 1;
border: none;
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
}
}
//video popup within image
.xpo-video-popup-image {
position: relative;
line-height: 0;
.xpo-video-popup {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
span {
position: absolute;
top: 50%;
left: 50%;
margin-top: -40px;
margin-left: -40px;
&:after {
content: "";
position: absolute;
border-top: 15px solid transparent;
border-left: 25px solid #fff;
border-bottom: 15px solid transparent;
top: 25px;
left: 30px;
}
&:before {
content: "";
border-radius: 100%;
position: absolute;
top: 0;
left: 0;
padding: 40px;
box-shadow: 0 0 0 15px rgba(65, 81, 255, 0.15);
background: $primarycolor;
}
}
}
}
.xpo-postx-builder-image {
.xpo-video-popup {
position: initial;
width: auto;
height: auto;
span {
margin-top: -90px;
margin-left: -90px;
width: 180px;
height: 180px;
border-radius: 100px;
padding: 0;
// -webkit-animation: pulse 1.2s ease infinite;
// animation: pulse 1.2s ease infinite;
// background: #857fff;
&:before {
padding: 50px;
box-shadow: 0 3px 10px 2px #b496e5, 0 0 0 18px rgb(255 255 255), 0 0 0 40px rgb(122 114 255 / 33%);
background: #5415ff;
background-image: linear-gradient(28deg, #5415ff 13%, #857fff 90%);
border: none;
top: 40px;
left: 40px;
}
&:after {
border-top: 15px solid transparent;
border-left: 25px solid #fff;
border-bottom: 15px solid transparent;
top: 75px;
left: 80px;
}
.xpo-popup-btn-bg {
-webkit-animation: pulse 1.2s ease infinite;
animation: pulse 1.2s ease infinite;
background: #857fff;
position: absolute;
width: 120px;
height: 120px;
border-radius: 100%;
top: 16%;
left: 19%;
margin-left: -3px;
margin-top: 3px;
}
}
}
}
.xpo-postx-builder-image.xpo-productx-builder-image .xpo-video-popup span:before {
box-shadow: 0 3px 10px 2px #f26654, 0 0 0 18px #fff, 0 0 0 40px rgba(255, 118, 49, 0.35);
background: #FF3F45;
background-image: linear-gradient(28deg,#FF3F45 13%,#FF987F 90%);
}
.xpo-postx-builder-image.xpo-productx-builder-image .xpo-video-popup span .xpo-popup-btn-bg {
background: #FF987F;
}
.xpo-feature-video {
.xpo-video-popup-image {
.xpo-video-popup span {
margin-left: 0;
left: -8%;
}
}
}
//list style
.xpo-list {
list-style: none;
padding: 0;
margin: 0;
li {
display: inline-block;
padding: 0 12px;
margin: 0 12px;
position: relative;
&:after {
content: "";
background-color: transparent;
position: absolute;
left: -8px;
top: 8px;
width: 6px;
border-bottom: 2px solid $primarycolor;
height: 9px;
border-right: 2px solid $primarycolor;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
&:before {
position: absolute;
content: "";
width: 20px;
height: 20px;
border: 1px solid $primarycolor;
left: -15px;
top: 4px;
border-radius: 100px;
}
// &.xpo-list-close {
// &:after {
// border: none !important;
// content: "\f335";
// font-family: dashicons;
// top: 2px;
// transform: rotate(0deg);
// -webkit-transform: rotate(0deg);
// left: -13px;
// height: auto;
// width: auto;
// color: #ff190c;
// }
// &:before {
// border: 1px solid #ff190c !important;
// }
// }
}
&.xpo-list-inline {
li {
display: block;
margin-bottom: 10px;
&:last-child {
margin-bottom: 0;
}
}
}
&.xpo-list-gray {
li {
&:after {
border-bottom: 2px solid $metacolor;
border-right: 2px solid $metacolor;
}
&:before {
border: 1px solid $metacolor;
}
}
}
&.xpo-list-white {
li {
&:after {
border-bottom: 2px solid #fff;
border-right: 2px solid #fff;
}
&:before {
border: 1px solid #fff;
}
}
}
}
.xpo-check-list {
list-style: none;
padding: 0;
margin: 0;
li {
position: relative;
display: inline-block;
padding-left: 35px;
margin-bottom: 20px;
&:after {
content: "";
background-color: transparent;
position: absolute;
left: 7px;
top: 8px;
width: 6px;
border-bottom: 2px solid $primarycolor;
height: 9px;
border-right: 2px solid $primarycolor;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
&:before {
position: absolute;
content: "";
width: 20px;
height: 20px;
border: 1px solid $primarycolor;
left: 0px;
top: 4px;
border-radius: 100px;
}
}
&.xpo-check-list-col {
display: -webkit-box;
display: -webkit-flex;
display: -moz-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-webkit-flex-flow: row wrap;
-moz-box-orient: horizontal;
-moz-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-moz-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
li {
width: 47%;
}
}
}
.xpo-check-fill-green li:before {
background: #76D055;
border: 1px solid #76D055;
}
.xpo-check-fill-green li:after {
border-bottom: 2px solid #fff;
border-right: 2px solid #fff;
}
.xpo-list-check {
list-style: none;
padding: 0;
margin: 0;
li {
position: relative;
display: inline-block;
padding-left: 35px;
margin-bottom: 15px;
padding-bottom: 15px;
border-bottom: 1px solid #e5e5e5;
line-height: 24px;
font-size: 16px;
&:after {
content: "";
background-color: transparent;
position: absolute;
left: 8px;
top: 5px;
width: 7px;
height: 11px;
border-bottom: 2.5px solid $primarycolor;
border-right: 2.5px solid $primarycolor;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
&:before {
position: absolute;
content: "";
width: 24px;
height: 24px;
left: 0px;
top: 0px;
border-radius: 100px;
}
&:last-child {
border-bottom: none;
padding-bottom: 0;
margin-bottom: 0;
}
}
&.xpo-list-graybg {
li {
&:before {
background: #F5F5F5;
}
}
}
}
//new landing page
.xpo-postx-start {
background-color: #E6F2FF;
background-image: linear-gradient(to bottom, #e5f1ff 1%, #fff 99%);
padding-top: 150px;
background-position: center center;
background-repeat: no-repeat;
background-size: cover;
position: relative;
padding-bottom: 350px;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-hero-bg.png");
background-size: cover;
background-position: center 30px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container,
.xpo-featured-on {
position: relative;
z-index: 1;
}
}
.xpo-productx-start {
background-color: #FFFBF8;
padding-top: 150px;
position: relative;
padding-bottom:100px;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2023/02/productx-hero-bg.png");
background-size: cover;
background-position: center -50px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-productx-start-header {
.xpo-btn-xlg {
font-size: 20px;
display: inline-block;
}
}
.xpo-productx-start-header a.xpo-video-popup {
color: $headingcolor;
}
.xpo-productx-start-header .xpo-video-popup-icon::before {
border: 2px solid $productxcolor;
}
.xpo-productx-start-header .xpo-video-popup-icon:after {
border-left: 9px solid $productxcolor;
}
.xpo-satisfy-items.xpo-grid-col3 {
grid-column-gap: 20px;
grid-row-gap: 20px;
}
.xpo-satisfy-item {
display: grid;
text-align: left;
padding: 10px 15px;
background: #fff;
border-radius: 4px;
grid-template-columns: auto 1fr;
grid-gap: 10px;
font-size: 14px;
align-items: center;
box-shadow: 0 0 30px 4px rgba(0, 0, 0, 0.08);
svg {
width: 50px;
}
}
.xpo-satisfy-info2 {
padding: 20px;
border-radius: 10px;
}
.xpo-satisfy-item2 {
grid-template-columns: auto 1fr;
display: grid;
grid-gap: 10px;
svg {
width: 50px;
}
}
.xpo-productx-builder-wrapper {
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2023/02/builder-bg-shape.png");
background-size: 1500px auto;
background-position: center 250px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-productx-query-wrapper {
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2023/02/productx-query-sort-bg.png");
background-size: 1600px auto;
background-position: center 250px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-productx-feature-wrapper {
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2023/02/productx-grow-feature-bg.png");
background-size: 1600px auto;
background-position: center 250px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-postx-overview {
margin-top: -450px;
}
.xpo-featured-on {
max-width: 1350px;
position: relative;
}
.xpo-featured-on-item {
display: grid;
grid-template-columns: auto 1fr;
align-items: center;
grid-gap: 80px;
padding: 30px 100px;
background: #fff;
border-radius: 6px;
box-shadow: 0 0 36px rgba(0, 0, 0, 0.05);
.xpo-featured-title {
color: #D5D5D5;
}
}
.xpo-feature-item-wrapper {
background: #D9ECFF;
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-promo-bg.png");
background-size: cover;
background-position: center 0px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-postx-overview,
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-feature-items.xpo-grid-col2 {
grid-column-gap: 60px;
grid-row-gap: 70px;
}
.xpo-feature-item {
img {
height: 45px;
}
.xpo-feature-content {
background: #fff;
padding: 30px;
border-radius: 10px;
}
}
.xpo-productx-promo-items {
border: 1px solid #62293F;
border-radius: 20px;
overflow: hidden;
}
.xpo-productx-promo-items .xpo-feature-item {
border-bottom: 1px solid #62293F;
border-right: 1px solid #62293F;
&.xpo-border-right-none {
border-right: none;
}
&.xpo-border-bottom-none {
border-bottom: none;
}
.xpo-feature-content {
border-radius: 0;
transition: 400ms;
color: #5D5D5D;
height: 100%;
display: flex;
flex-wrap: wrap;
.xpo-feature-header {
display: flex;
align-items: center;
img {
width: 40px;
margin: 0 15px 0 0;
}
}
a {
display: inline-block;
color: #FF6845;
transition: 400ms;
border-bottom: 1px solid;
margin-top: auto;
font-weight: 700;
}
&:hover {
background: #62293F;
h4 {
color: #fff;
}
color: #fff;
a {
color: #fff;
}
}
}
}
//xpo-postx-blocks-addons
.xpo-postx-blocks-addons {
background: radial-gradient(circle, rgba(19,25,142,1) 0%, rgba(48,56,227,1) 62%, rgba(116,122,255,1) 100%);
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-block-addon-bg.png");
background-size: 1920px auto;
background-position: center 0px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-postx-blocks {
display: grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 60px;
grid-row-gap: 40px;
background: #fff;
padding: 55px 55px 0;
margin-bottom: 50px;
border-radius: 20px;
align-items: center;
&:last-child {
margin-bottom: 0;
}
}
.xpo-postx-blocks-content {
max-width: 400px;
}
.xpo-postx-blocks-image {
line-height: 0;
}
//postx slider
.xpo-postx-slider-wrapper {
background: #D9ECFF;
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-slider-bg.png");
background-size: 1920px auto;
background-position: center;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-postx-slider {
background: #fff;
border-radius: 6px;
padding: 12px 35px;
margin-bottom: 25px;
margin-top: 70px;
}
.xpo-slider-check {
list-style: none;
padding: 0;
margin: 0;
}
.xpo-slider-check li {
display: inline-block;
margin-right: 30px;
position: relative;
padding-left: 20px;
font-weight: 700;
font-size: 14px;
}
.xpo-slider-check li:last-child {
margin-right: 0;
}
.xpo-slider-check li:before {
position: absolute;
content: "";
width: 12px;
height: 12px;
left: 0;
top: 6px;
border-radius: 100px;
background: #5bc467;
}
.xpo-slider-check li:after{
content: "";
background-color: transparent;
position: absolute;
left: 4px;
top: 8px;
width: 4px;
height: 6px;
border-bottom: 1.5px solid #fff;
border-right: 1.5px solid #fff;
transform: rotate(45deg);
-webkit-transform: rotate(45deg);
}
//xpo-postx-feature-wrapper
.xpo-postx-feature-wrapper {
background: #EFF5FD;
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-feature-bg.png");
background-size: 1570px auto;
background-position: center 180px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-feature-left {
display: grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 60px;
grid-row-gap: 40px;
border-radius: 20px;
align-items: center;
}
.xpo-productx-blocks-addons .xpo-feature-left {
grid-column-gap: 100px;
}
.xpo-card-feature {
border-radius: 20px;
padding: 55px;
}
.xpo-feature-grid {
display: grid;
grid-template-columns: 1fr 1fr;
grid-column-gap: 60px;
}
.xpo-feature-grid .xpo-card-feature {
padding: 35px 55px;
}
.xpo-feature-grid .xpo-postx-blocks-content {
max-width: 100%;
}
.xpo-card-feature .xpo-postx-blocks-image {
margin: -30px -55px 30px;
padding: 30px 55px;
border-radius: 20px 20px 0 0;
}
.xpo-tap-content .xpo-card-feature .xpo-postx-blocks-image {
margin: 0;
padding: 0;
}
.xpo-cta-wrapper {
padding: 70px 90px;
background-color: #000B8B;
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/cta-bg.png");
background-size: 1570px auto;
background-position: center;
background-repeat: no-repeat;
border-radius: 20px;
}
.xpo-cta-wrapper2 {
background-color: #5b40f4;
background-image: url("https://www.wpxpo.com/wp-content/uploads/2023/03/productx-cta-middle.png");
}
.xpo-cta-left {
display: grid;
grid-template-columns: 1fr auto;
grid-column-gap: 90px;
align-items: center;
}
//xpo-postx-list-wrapper
.xpo-postx-list-wrapper {
background-color: #EFF5FD;
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-feature2.png");
background-size: cover;
background-position: center 120px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-postx-list {
padding: 0;
margin: 0;
text-align: center;
}
.xpo-postx-list li {
display: inline-block;
padding: 18px 40px;
border-radius: 10px;
box-shadow: 3px 3px 6px 0 rgba(3, 127, 255, 0.20);
background: #fff;
font-size: 24px;
font-weight: 700;
margin: 10px;
text-align: center;
}
.xpo-productx-list li {
font-size: 16px;
padding: 15px 30px;
margin: 5px;
border-radius: 5px;
}
//xpo-offer-faq-wrapper
.xpo-offer-faq-wrapper {
background: #EFF5FD;
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-faq-bg.png");
background-size: 1920px auto;
background-position: center 100px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.productx-cta-wrapper:after {
display: none;
}
//xpo-postx-builder
.xpo-postx-builder-wrapper {
background: #EFF5FD;
}
.xpo-web-creation {
padding: 100px 0;
background: #fff;
}
.xpo-creation-content {
display: flex;
flex-wrap: nowrap;
align-items: center;
margin: 70px auto 0;
}
.xpo-creation-content {
ul {
padding: 0;
margin: 0px;
width: 750px;
li {
list-style: none;
text-align: center;
font-family: $font-heading;
line-height: 24px;
margin: 10px 0 10px 0;
color: $headingcolor;
cursor: pointer;
text-align: left;
}
}
}
.xpo-creation-content {
> ul {
li {
font-size: 22px;
span {
padding: 12px 22px;
display: inline-block;
font-weight: 700;
em {
font-style: inherit;
font-size: 14px;
line-height: 18px;
margin-top: 10px;
display: none;
}
}
&.active {
span {
em {
display: block;
}
background: #00174B;
color: #fff;
border-radius: 2px;
// margin-left: 22px;
position: relative;
&::before {
content: "";
position: absolute;
right: -24px;
top: 50%;
margin-top: -12px;
border-style: solid;
border-color: transparent transparent transparent #00174B;
border-width: 12px 12px;
}
}
}
}
}
.xpo-creation-more {
font-size: 22px;
margin-left: 20px;
color: rgba(0, 0, 0, 0.4);
text-decoration: underline;
}
}
.xpo-web-creation-productx .xpo-creation-content>ul li.active span::before {
border-color: transparent transparent transparent #FFCFAC;
}
.xpo-web-creation-productx .xpo-creation-content>ul li.active span {
background: #FFCFAC;
color: $headingcolor;
}
.xpo-creation-image {
margin-left: auto;
text-align: right;
ul {
width: auto !important;
li {
margin: 0;
text-align: right;
display: none;
&.active {
display: block;
}
}
}
img {
max-width: 95%;
}
.xpo-live-video {
width: 90%;
}
}
//xpo-tap-content-nav
.xpo-tap-content-nav {
ul {
padding: 0;
margin: 0 0 30px;
list-style: none;
text-align: center;
> li {
display: inline-block;
margin: 0 15px;
> span {
padding: 10px 20px;
display: inline-block;
box-shadow: 0 3px 6px 0 rgba(0, 109, 222, 0.47);
border-radius: 100px;
font-size: 16px;
cursor: pointer;
background: #fff;
}
&.active {
> span {
background: #00174B;
color: #fff;
position: relative;
box-shadow: 5px 10px 20px 0 rgba(13, 3, 255, 0.24);
&:after {
content: "";
border-width: 20px 20px;
border-style: solid;
border-color: transparent transparent #fff transparent;
position: absolute;
top: 34px;
left: 50%;
margin-left: -20px;
}
}
}
}
}
}
.xpo-tap-content {
ul {
text-align: left;
margin-bottom: 0;
li {
display: none;
&.active {
display: block;
}
}
}
}
.xpo-tap-content-nav.xpo-productx-content-nav ul>li.active>span {
background: #f66e50;
box-shadow: 5px 10px 20px 0 rgba(246, 110, 80, .40);
}
.xpo-tap-content-nav.xpo-productx-content-nav ul>li>span {
box-shadow: 0 3px 6px 0 rgba(246, 110, 80, .60);
}
//review
.xpo-review-container {
padding: 20px;
display: grid;
grid-template-columns: 300px 1fr;
grid-gap: 70px;
align-items: center;
&.xpo-container {
padding: 50px 80px;
border-radius: 20px;
border: 1px solid #b6c2e5;
background: #fff;
}
}
.xpo-review-img {
display: block;
}
.xpo-review-content {
width: 100%;
> div {
padding-top: 50px;
}
}
.xpo-review-content .xpo-review-quate {
position: relative;
}
.xpo-review-content .xpo-review-quate::after {
content: '“';
position: absolute;
height: 0px;
top: -70px;
text-align: left;
font-family: $font-heading;
font-size: 150px;
font-weight: bold;
color: $primarycolor;
}
.xpo-review-content .xpo-review-text {
margin-bottom: 20px;
text-align: left;
font-family: $font-heading;
font-size: 28px;
color: $headingcolor;
}
.xpo-review-content .xpo-review-name {
text-align: left;
font-family: $font-heading;
font-size: 18px;
color: #070c1a;
}
.xpo-review-content .xpo-reviewer-position {
text-align: left;
font-family: $font-heading;
font-size: 18px;
color: $primarycolor;
}
//postx feature landing
.postx-feature-landing-1,
.postx-feature-landing-2,
.postx-feature-landing-3,
.postx-feature-landing-4 {
position: relative;
&:after {
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.postx-feature-landing-1 {
&:after {
background-size: 1444px auto;
background-position: center 100px;
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-feature-landing-bg1.png");
}
}
.postx-feature-landing-2 {
&:after {
background-size: 1500px auto;
background-position: center 100px;
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-feature-landing-bg2.png");
}
}
.postx-feature-landing-3 {
&:after {
background-size: 1444px auto;
background-position: center 150px;
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-feature-landing-bg3.png");
}
}
.postx-feature-landing-4 {
&:after {
background-size: 1600px auto;
background-position: center 150px;
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-feature-landing-bg4.png");
}
}
//Progress Bar
.xpo-progressbar-wrapper {
background: #000B62;
position: relative;
&:after {
background-image: url("https://www.wpxpo.com/wp-content/uploads/2022/10/postx-performance-bg.png");
background-size: cover;
background-position: center 0px;
background-repeat: no-repeat;
top: 0;
left: 0;
width: 100%;
height: 100%;
position: absolute;
content: "";
}
.xpo-container {
position: relative;
z-index: 1;
}
}
.xpo-progressbar {
position: relative;
max-width: 180px;
text-align: center;
margin: 0 auto;
}
.xpo-progressbar svg {
width: 180px;
height: 180px;
margin: 0 auto;
text-align: center;
}
.progressbar-value {
font-size: 32px;
font-weight: 700;
position: absolute;
top: 61%;
left: 50%;
color: #fff;
transform: translate(-50%, -50%);
}
.progressbar-title {
display: inline-block;
margin-bottom: 20px;
font-size: 28px;
color: #fff;
font-weight: 700;
}
.xpo-bar-1,
.xpo-bar-2,
.xpo-bar-3,
.xpo-bar-4 {
fill: none;
stroke-width: 8px;
stroke-linecap: round;
transform: rotate(-90deg);
transform-origin: 50% 50%;
}
.xpo-bar-bg {
fill: none;
stroke-width: 36px;
stroke: #001138;
}
.xpo-bar-1 {
stroke: #41C5FF;
filter: drop-shadow(0 0px 5px #2196f3);
}
.xpo-bar-2 {
stroke: #00FFB1;
filter: drop-shadow(0 0px 5px #00FFB1);
}
.xpo-bar-3 {
stroke: #FFD972;
filter: drop-shadow(0 0px 5px #FFD972);
}
.xpo-bar-1,
.xpo-bar-2,
.xpo-bar-3 {
stroke-dasharray: 440;
stroke-dashoffset: 0;
animation: progress-2 .75s ease-out;
}
.xpo-bar-4 {
stroke: #FF71A7;
stroke-dasharray: 470;
stroke-dashoffset: 50;
animation: progress-2 .75s ease-out;
filter: drop-shadow(0 0px 5px #FF71A7);
}
@keyframes progress-1 {
from {
stroke-dashoffset: 440;
}
to {
stroke-dashoffset: 0;
}
}
@keyframes progress-2 {
from {
stroke-dashoffset: 470;
}
to {
stroke-dashoffset: 50;
}
}
.xpo-live-video {
pointer-events: none;
// border: 15px solid #fff;
border-radius: 8px;
// box-shadow: 0 20px 80px -12px rgb(50 50 93 / 30%), 0 20px 40px -20px rgb(0 0 0 / 30%), 0 -15px 50px -10px rgb(0 0 0 / 35%);
width: 100%;
}
//footer
.xpo-footer-brand {
img {
max-width: 70%;
margin-bottom: 20px;
}
color: rgba(255,255,255,.6);
font-size: 14px;
line-height: 25px;
>div {
padding-right: 20px;
}
}
.xpo-title-shape {
position: relative;
&:after {
position: absolute;
left: 0;
bottom: 6px;
height: 17px;
width: calc(100% + 12px);
background: #ffce96;
content: "";
border-radius: 10px;
z-index: -1;
margin-left: -6px;
transform: skewX(-30deg);
}
}
@media (max-width: 1200px) {
.xpo-tap-content-nav ul>li>span {
padding: 7px 12px;
font-size: 14px;
}
.xpo-tap-content-nav ul>li {
margin: 0 5px;
}
.video-bg {
margin-left: -53px;
}
.xpo-review-container {
grid-template-columns: 200px 1fr;
grid-gap: 50px;
}
}
@media (max-width: 992px) {
.xpo-main-title42,
.xpo-main-title44 {
font-size: 32px;
}
.xpo-space-pt130 {
padding-top: 100px;
}
.xpo-space-pt150 {
padding-top: 110px;
}
.xpo-postx-start {
padding-top: 110px;
padding-bottom: 150px;
}
.xpo-postx-overview {
margin-top: -250px;
}
.xpo-featured-on-item {
grid-gap: 20px;
padding: 20px 50px;
}
.video-bg {
max-width: 100%;
height: auto;
padding: 83px;
background-position: 50% 59%;
background-size: 723px;
margin-left: 0;
margin-top: -30px;
}
.xpo-satisfy-item {
> img {
display: none;
}
}
.xpo-postx-builder-image .xpo-popup-btn-bg {
top: 25%;
left: 39%;
}
.xpo-tap-content-nav ul>li>span {
padding: 6px 10px;
font-size: 13px;
}
.xpo-tap-content-nav ul>li {
margin: 0 5px 10px;
}
.xpo-tap-content-nav ul>li.active>span:after {
display: none;
}
.xpo-feature-item .xpo-feature-content {
padding: 25px;
}
.xpo-feature-item .xpo-feature-content h4 {
font-size: 18px;
}
.xpo-feature-item .xpo-feature-content span {
font-size: 14px;
}
.xpo-creation-content ul li {
margin: 5px 0 5px 0;
}
.xpo-creation-content>ul li span {
padding: 8px 20px;
}
.xpo-postx-blocks {
padding: 30px 30px 0;
}
.xpo-postx-blocks .xpo-main-title42 {
font-size: 24px;
}
.xpo-postx-blocks .xpo-title20 {
font-size: 16px;
}
.xpo-slider-check li {
margin-right: 20px;
}
.xpo-card-feature {
padding: 30px;
}
.xpo-feature-grid .xpo-card-feature {
padding: 30px;
}
.xpo-card-feature .xpo-postx-blocks-image {
margin: -30px -30px 30px;
}
.xpo-postx-blocks-content .xpo-main-title42 {
font-size: 24px;
}
.xpo-feature-grid {
grid-column-gap: 50px;
}
.xpo-cta-wrapper {
padding: 40px;
}
.xpo-cta-left .xpo-cta-content {
margin-bottom: 40px;
}
.xpo-cta-left {
display: block;
}
.xpo-postx-list li {
margin: 5px;
font-size: 20px;
padding: 10px 20px;
}
.xpo-sm-mb20 {
margin-bottom: 20px;
}
.xpo-sm-mb25 {
margin-bottom: 25px;
}
.xpo-sm-mb40 {
margin-bottom: 40px;
}
.xpo-sm-mb50 {
margin-bottom: 50px;
}
.xpo-sm-mt50 {
margin-top: 50px;
}
.xpo-btn-group {
.xpo-btn-postx-light {
&:last-child {
margin-top: 10px;
margin-left: 0 !important;
}
}
}
//compare
.postx-compare-hero .xpo-feature-left {
grid-template-columns: 1fr;
}
}
@media (max-width: 767px) {
.video-bg {
max-width: 100%;
height: auto;
padding: 60px;
background-position: 50% 57%;
background-size: 480px;
margin-top: 0;
}
.xpo-main-title42 {
font-size: 32px;
}
.xpo-title22 {
font-size: 18px;
}
.xpo-satisfy-item {
> img {
display: none;
}
}
.xpo-reviews-rating h4 {
font-size: 16px;
}
.xpo-feature-left {
grid-template-columns: 1fr;
}
.xpo-review-container {
grid-template-columns: 1fr;
grid-gap: 40px;
}
.xpo-featured-on-item {
grid-template-columns: 1fr;
}
.xpo-postx-blocks {
grid-template-columns: 1fr;
padding: 30px;
}
.xpo-feature-grid {
grid-template-columns: 1fr;
grid-gap: 50px;
}
.xpo-btn-group {
.xpo-btn-postx-light {
&:last-child {
margin-top: 0;
margin-left: 10px !important;
}
}
}
.xpo-feature-video .xpo-video-popup-image .xpo-video-popup span {
margin-left: -90px;
left: 50%;
}
}
.xpo-landing-footer {
background: #f8f8f8;
border-top: 1px solid #e5e5e5;
.xpo-footer-inner {
padding: 50px 0;
.xpo-footer-img {
img {
width: 250px;
}
margin-bottom: 40px;
}
.xpo-footer-brand {
p {
margin: 0;
font-size: 20px;
a {
text-decoration: underline;
font-weight: 700;
}
}
margin-bottom: 60px;
}
.xpo-footer-menu {
list-style: none;
margin: 0;
padding: 0;
li {
display: inline-block;
margin: 0 20px;
font-size: 22px;
a {
color: $metacolor;
transition: 400ms;
&:hover {
color: $primarycolor;
}
}
}
}
}
}
span.typed-text {
color: #ff5845;
}
span.cursor {
display: inline-block;
background-color: red;
margin-left: 0.1rem;
width: 2px;
animation: blink 1s infinite;
line-height: 1;
}
span.cursor.typing {
animation: none;
}
@keyframes blink {
0% { background-color: #ff5845; }
49% { background-color: #ff5845; }
50% { background-color: #ff5845; }
99% { background-color: #ff5845; }
100% { background-color: #ff5845; }
}Leave a Comment