/*---------------------------------------- /* Smart Post Show help page base css /*----------------------------------------*/ .spspc__help.lite-to-pro-page *, .spspc__help.start-page *, .spspc__help.about-page *, .spspc__help.header * { margin: 0; padding: 0; box-sizing: border-box; } .sp-smart-post__help a { text-decoration: none; } .sp-smart-post__help a:focus { box-shadow: none; outline: none; } .sp-smart-post__help { margin-left: -20px; } .sp-smart-post__help .spspc-recommended-page .spspc-container { padding: 0 50px; max-width: 1300px; margin: auto; } /*----------------------------------------*/ /* Block css /*----------------------------------------*/ .sp-smart-post__help .spspc-section-title{ font-size: 28px; font-weight: 600; line-height: 28px; color: #2F2F2F; border-radius: 6px; } .spspc-recommended-page .spspc-section-title { font-size: 22px; margin-top: -6px !important; } .sp-smart-post__help .spspc-call-to-action-top .spspc-section-subtitle { font-size: 16px; line-height: 22px; display: inline-block; margin-top: 4px; } .sp-smart-post__help .spspc-small-paragraph, .sp-smart-post__help .spspc-normal-paragraph{ font-size: 14px; font-weight: 400; line-height: 22px; color: #3C434A; display: inline-block; } .sp-smart-post__help .spspc-small-paragraph { font-size: 12px; } .sp-smart-post__help .spspc-section-subtitle { font-size: 18px; line-height: 28px; font-weight: 400; } .sp-smart-post__help .spspc-big-btn-border, .sp-smart-post__help .spspc-small-btn, .sp-smart-post__help .spspc-big-btn, .sp-smart-post__help .spspc-medium-btn{ font-size: 16px; font-weight: 500; line-height: 20px; color: #6D6B6A; border: 1px solid #6D6B6A; display: inline-block; padding: 14px 24px; border-radius: 4px; transition: .3s; } .sp-smart-post__help .spspc-small-btn { padding: 8px 16px; font-size: 14px; } .sp-smart-post__help .spspc-arrow-btn { padding: 14px 18px 14px 24px; } .sp-smart-post__help .spspc-big-btn:hover { background-color: #009758; } .sp-smart-post__help .spspc-big-btn{ padding: 16px 30px; background-color: #05AA64; color: #fff; border-color: transparent; } .sp-smart-post__help .spspc-big-btn-border { padding: 16px 30px; } .sp-smart-post__help .spspc-info-box-title{ font-size: 18px; font-weight: 600; color: #1D2327; } .sp-smart-post__help .spspc-close-icon, .sp-smart-post__help .spspc-check-icon{ background-position: center; background-repeat: no-repeat; } .sp-smart-post__help .spspc-close-icon { background-image: url(../img/close-icon.svg); } .sp-smart-post__help .spspc-check-icon { background-image: url(../img/check-icon.svg); } .sp-smart-post__help i.spspc-hot, .sp-smart-post__help i.spspc-new { display: inline-block; background: #14ae5c; color: #fff; font-size: 10px; text-align: center; border-radius: 40px; font-style: normal; font-weight: 600; text-transform: uppercase; padding: 0 8px; margin-left: 5px; line-height: 17px; } .sp-smart-post__help i.spspc-hot { background-color: #EC2121; } .sp-smart-post__help i.spspc-info { color: #757575; } .spspc-help-tooltip { background-color: rgba(12, 25, 36, 1); padding: 8px 12px; border-radius: 4px; font-size: 15px; color: #94b2c1; box-shadow: 0 7px 29px 0 hsla(240,5%,41%,.2); line-height: 1.5; width: 400px; position: relative; } .spspc-help-tooltip::after { content: ""; position: absolute; top: 14px; left: -15px; transform: translateY(-50%); border-width: 10px; border-style: solid; border-color: transparent rgba(12, 25, 36, 1) transparent transparent; } /*----------------------------------------*/ /* Start page style /*----------------------------------------*/ .sp-smart-post__help #recommended-tab { display: none; } .sp-smart-post__help .spspc-about-btn a:hover:nth-child(1) { background-color: var(--sp-smart-primary-2-700); } .sp-smart-post__help .spspc-live-pro-demo { color: var(--sp-smart-primary-2-600); border-color: var(--sp-smart-primary-2-600); } .sp-smart-post__help .spspc-big-btn-border:hover, .sp-smart-post__help .spspc-medium-btn:hover, .sp-smart-post__help .spspc-small-btn:hover { color: #fff; background-color: var(--sp-smart-primary-2-600); border-color: transparent; } /*----------------------------------------*/ /* Lite vs Pro style /*----------------------------------------*/ .sp-smart-post__help .spspc-call-to-action-top { display: flex; justify-content: space-between; align-items: center; background-color: #EFE6FB; padding: 32px; margin-bottom: 24px; border-radius: 6px; } .sp-smart-post__help .spspc-lite-to-pro-wrap { padding: 40px; background: #fff; border-radius: 8px; padding-bottom: 100px; } .spspc-lite-vs-pro-section-title { padding: 20px 30px !important; display: block; font-size: 22px; background: #EFE6FB; font-weight: 600; line-height: 28px; color: #2F2F2F; } .sp-smart-post__help .spspc-features{ border-radius: 6px; border: 1px solid #EFE6FB; overflow: hidden; margin-bottom: 80px; } .sp-smart-post__help .spspc-features ul li.spspc-body, .sp-smart-post__help .spspc-features ul li.spspc-header { display: flex; justify-content: space-between; background: var(--sp-smart-primary-2-600); font-size: 20px; color: #fff; font-weight: 600; } .sp-smart-post__help .spspc-features ul li.spspc-body{ background-color: #fff; color: #3C434A; font-size: 16px; font-weight: 400; } .sp-smart-post__help .spspc-features ul li.spspc-body:nth-child(even) { background-color: #F8F6FB; } .sp-smart-post__help .spspc-features ul li.spspc-body .spspc-title, .sp-smart-post__help .spspc-features ul li.spspc-header .spspc-title { flex-basis: 90%; width: 90%; text-align: left; } .sp-smart-post__help .spspc-features ul li.spspc-body .spspc-title{ line-height: 24px; } .sp-smart-post__help .spspc-features ul li.spspc-body span, .sp-smart-post__help .spspc-features ul li.spspc-header span { padding: 28px; width: 13%; text-align: center; } .sp-smart-post__help .spspc-features ul li.spspc-body span { padding: 20px 30px; } .sp-smart-post__help .spspc-features ul li.spspc-body span:not(:last-of-type){ border-right: 1px solid #EFE6FB; } .sp-smart-post__help .spspc-upgrade-to-pro { text-align: center; margin: auto; max-width: 750px; margin-top: 25px; } .sp-smart-post__help .spspc-upgrade-to-pro .spspc-section-subtitle { margin: 15px 0 20px; display: inline-block; } .sp-smart-post__help .spspc-upgrade-to-pro .spspc-upgrade-to-pro-btn { display: flex; justify-content: center; align-items: flex-start; gap: 15px; } .sp-smart-post__help .spspc-upgrade-to-pro .spspc-upgrade-to-pro-btn .spspc-action-btn span { display: block; font-size: 11px; } .sp-smart-post__help .spspc-upgrade-to-pro .spspc-upgrade-to-pro-btn .spspc-action-btn span a{ color: inherit; text-decoration: underline dotted; transition: .2s linear; } .sp-smart-post__help .spspc-upgrade-to-pro .spspc-upgrade-to-pro-btn .spspc-action-btn span a:hover{ color: var(--sp-smart-primary-2-600); } /*----------------------------------------*/ /* Testimonial Section style /*----------------------------------------*/ .sp-smart-post__help .spspc-testimonial .spspc-testimonial-title-section { text-align: center; margin: 80px 0 40px; } .sp-smart-post__help .spspc-testimonial .spspc-testimonial-title-section span { font-size: 14px; font-weight: 600; color: var(--sp-smart-primary-2-600); margin-bottom: 12px; display: inline-block; } .sp-smart-post__help .spspc-testimonial-wrap { display: flex; gap: 30px; } .sp-smart-post__help .spspc-testimonial-content { background-color: #fff; padding: 20px 25px; position: relative; border-radius: 8px; margin-bottom: 20px; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.06); } .sp-smart-post__help .spspc-testimonial-content p { font-size: 16px; line-height: 28px; color: #3C434A; } .sp-smart-post__help .spspc-testimonial-content::after { content: ""; position: absolute; bottom: -13px; left: 40px; width: 25px; height: 15px; background-color: #ffffff; clip-path: polygon(0 0, 50% 100%, 100% 0); } .sp-smart-post__help .spspc-testimonial-info { display: flex; gap: 20px; margin-left: 20px; } .sp-smart-post__help .spspc-testimonial-info .spspc-info { display: flex; flex-direction: column; justify-content: center; gap: 6px; } .sp-smart-post__help .spspc-testimonial-info .spspc-img img { border-radius: 50%; width: 60px; } .sp-smart-post__help .spspc-testimonial-info .spspc-info h3 { font-size: 16px; color: #1D2327; } .sp-smart-post__help .spspc-testimonial-info .spspc-info p { margin: 4px 0; font-size: 12px; color: #3C434A; } .sp-smart-post__help .spspc-testimonial-info .spspc-info .spspc-star { color: #FFC329; font-size: 17px; } @media screen and (min-width: 1600px) { .sp-smart-post__help .plugin-card { width:48%; width: calc(49% - 8px) } .sp-smart-post__help .plugin-card:nth-child(odd) { clear: none; margin-left: 8px } .sp-smart-post__help .plugin-card:nth-child(2n) { margin-right: 0 } .sp-smart-post__help .plugin-card:nth-child(3n+1) { clear: both; margin-left: 8px } .sp-smart-post__help .plugin-card:nth-child(3n) { margin-right: 8px } } /*----------------------------------------*/ /* Recommended page style /*----------------------------------------*/ .sp-smart-post__help .spspc-recommended-page h2{ margin: 38px 0px 20px 8px; } /*----------------------------------------*/ /* About us page style /*----------------------------------------*/ .sp-smart-post__help .spspc-about-box { display: flex; background: #fff; margin-top: 50px; padding: 40px; border-radius: 8px; box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.06); } .sp-smart-post__help .spspc-about-img { width: 50%; flex-basis: 50%; flex-shrink: 0; overflow: hidden; align-self: center; } .sp-smart-post__help .spspc-about-img span { text-align: center; display: block; margin-top: 12px; font-weight: 400; font-size: 13px; font-style: italic; color: #3C434A; } .sp-smart-post__help .spspc-about-img img { width: 100%; display: block; border-radius: 8px; } .sp-smart-post__help .spspc-about-info h3 { font-size: 26px; line-height: 32px; margin-bottom: 25px; color: #1D2327; } .sp-smart-post__help .spspc-about-info { margin-right: 40px; } .sp-smart-post__help .spspc-about-info p{ line-height: 28px; margin-bottom: 15px; font-size: 15px; font-weight: 400; color: #3C434A; } .sp-smart-post__help .spspc-about-btn{ margin-top: 40px; display: flex; gap: 20px; } .sp-smart-post__help .spspc-about-btn a:nth-child(1){ background-color: var(--sp-smart-primary-2-600); border-color: transparent; color: #ffffff; } .sp-smart-post__help .spspc-free-pro { padding: 0 !important; display: flex; justify-content: center; align-items: center; } /* Responsive Css */ @media only screen and (max-width: 960px) { .sp-smart-post__help .spspc-about-box, .sp-smart-post__help .spspc-about-img { width: 100%; margin-top: 30px; } .sp-smart-post__help { margin-left: -10px; } } @media only screen and (max-width: 640px) { .sp-smart-post__help .spspc-testimonial-wrap{ flex-direction: column; } .sp-smart-post__help .spspc-about-btn { display: inline-grid; } }