#hero-section-wrapper { padding: 160px 0 80px; background-color: var(--pg-color-ink); display: flex; align-items: center; } #hero-section-wrapper.black { background-color: var(--pg-color-black); } #hero-section-wrapper .eyebrow-text { font-size: 21px; font-weight: 500; color: var(--pg-color-muted); margin-bottom: 30px; text-transform: uppercase; } #hero-section-wrapper .eyebrow-text.gray { color: var(--pg-color-muted); } #hero-section-wrapper h1 { color: var(--pg-color-white); font-weight: 500; text-transform: none; font-size: 101px; } @media (max-width: 992px) { #hero-section-wrapper h1 { font-size: 67px; } } @media (max-width: 767px) { #hero-section-wrapper h1 { font-size: 48px; } } @media (max-width: 420px) { #hero-section-wrapper h1 { font-size: 36px; } } #hero-section-wrapper h1.gray { color: var(--pg-color-surface); font-weight: 500; text-transform: none; font-size: 101px; } @media (max-width: 992px) { #hero-section-wrapper h1.gray { font-size: 67px; } } @media (max-width: 767px) { #hero-section-wrapper h1.gray { font-size: 48px; } } @media (max-width: 420px) { #hero-section-wrapper h1.gray { font-size: 36px; } } #hero-section-wrapper strong { color: var(--pg-orange); } #hero-section-wrapper .subtitle { font-size: 22px; color: var(--pg-color-muted); margin-bottom: 0; padding-bottom: 30px; line-height: 140%; font-weight: 400; } #hero-section-wrapper hr { max-width: 700px; height: 2px; background-color: var(--pg-orange); border: 0; padding: 0; margin: 24px 0; opacity: 1; } #hero-section-wrapper .button-row { display: inline-block; padding: 0; } .hero-content-wrapper { display: flex; justify-content: space-between; } #hero-section-wrapper .hero-content { position: relative; max-width: 750px; flex: 1; } #hero-section-wrapper .hero-image { flex: 1; max-width: 50%; } #hero-section-wrapper .hero-image .videoembed { display: block; max-width: 480px; margin: 0 auto; } #hero-section-wrapper .hero-image img { max-width: 400px; width: 100%; margin: 0 auto; } #stats-section-wrapper { padding: 80px 0; background-color: var(--pg-color-ink); } #stats-section-wrapper .stat-image-content { width: 50px; margin-right: 20px; } #stats-section-wrapper .stat-image-content img { display: block; width: 100%; height: auto; } #stats-section-wrapper p { line-height: 140%; } #stats-section-wrapper p.value { font-size: 52px; font-weight: 700; margin: 0; color: var(--pg-orange); line-height: 80%; } #stats-section-wrapper p.what { font-size: 21px; font-weight: 700; margin: 0; color: var(--pg-color-surface); } #stats-section-wrapper p.per { font-size: 16px; font-weight: 400; margin: 0; color: var(--pg-color-surface); } #promote-section-wrapper { padding: 36px 0; text-align: center; font-size: 18px; font-weight: 300; background-color: var(--pg-color-ink); color: var(--pg-color-surface); } #promote-section-wrapper a { display: inline-block; margin: 0 auto; } #promote-section-wrapper img { display: block; width: 100%; height: auto; max-width: 300px; margin: 0 auto; } #about-device-section-wrapper { position: relative; display: flex; align-items: center; min-height: 720px; } #about-device-section-wrapper:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: rgb(16,16,16); background: -moz-linear-gradient(90deg, rgba(16,16,16,0.5) 0%, rgba(16,16,16,0.4) 40%, rgba(16,16,16,0) 100%); background: -webkit-linear-gradient(90deg, rgba(16,16,16,0.5) 0%, rgba(16,16,16,0.4) 40%, rgba(16,16,16,0) 100%); background: linear-gradient(90deg, rgba(16,16,16,0.5) 0%, rgba(16,16,16,0.4) 40%, rgba(16,16,16,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="var(--pg-color-ink)",endColorstr="var(--pg-color-ink)",GradientType=1); z-index: 0; } #about-device-section-wrapper.big-text .about-device-content { position: relative; transform: none; left: auto; top: auto; padding: 60px 0; } #about-device-section-wrapper .about-device-content { position: relative; z-index: 1; } .about-device-content .black-box { max-width: 570px; } .about-device-content h3 { font-size: 36px; font-weight: 500; margin-bottom: 30px; text-transform: none; } @media (max-width: 992px) { .about-device-content h3 { font-size: 32px; } } @media (max-width: 767px) { .about-device-content h3 { font-size: 28px; } } @media (max-width: 420px) { .about-device-content h3 { font-size: 24px; } } .about-device-content h3 strong { color: var(--pg-orange); font-weight: 500; text-transform: none; } .about-device-content p { font-size: 21px; font-weight: 300; line-height: 140%; color: var(--pg-color-surface); margin-bottom: 30px; } .about-device-content a.cta { font-size: 14px; font-weight: 500; text-decoration: none; color: var(--pg-color-ink); } #insight-capabilities-wrapper { background-color: var(--pg-color-ink); position: relative; } #insight-capabilities-wrapper h2 strong { color: var(--pg-orange); font-weight: 500; text-transform: none; } #insight-capabilities-wrapper .col-content { display: flex; max-width: 420px; margin: 0 auto; } #insight-capabilities-wrapper .col-content img { margin-right: 20px; } #insight-capabilities-wrapper .col-content p { font-size: 18px; font-weight: 400; line-height: 160%; color: var(--pg-color-surface); margin: 0; } #insight-capabilities-wrapper .col-content p strong { font-weight: 600; color: var(--pg-orange); } .insight-capabilities-content { padding: 120px 0; background-color: var(--pg-color-ink); min-height: 560px; } #insight-benefits-wrapper { padding: 100px 0; background-color: var(--pg-color-ink); } #insight-benefits-wrapper h2.title { text-align: center; color: var(--pg-color-surface); font-weight: 500; text-transform: none; font-size: 67px; } @media (max-width: 992px) { #insight-benefits-wrapper h2.title { font-size: 48px; } } @media (max-width: 767px) { #insight-benefits-wrapper h2.title { font-size: 36px; } } @media (max-width: 420px) { #insight-benefits-wrapper h2.title { font-size: 32px; } } #insight-benefits-wrapper #tabs .tab { width: 280px; background-color: var(--pg-color-ink); border-radius: 15px; padding: 12px 26px; cursor: pointer; position: relative; z-index: 5; font-size: 16px; font-weight: 500; color: var(--pg-color-muted); display: flex; align-items: center; justify-content: center; transition: 0.1s linear all; } #insight-benefits-wrapper .tabs-content-navigation { background-color: var(--pg-color-ink); display: flex; justify-content: center; width: max-content; margin: 0 auto; border-radius: 15px; overflow: hidden; margin-bottom: 60px; } #insight-benefits-wrapper #tabs .tab:last-of-type { margin-right: 0; } #insight-benefits-wrapper #tabs .tab:hover { background-color: var(--pg-orange); color: var(--pg-color-surface); font-weight: 500; } #insight-benefits-wrapper #tabs .whiteborder { background-color: var(--pg-orange); color: var(--pg-color-surface); font-weight: 500; } #insight-benefits-wrapper #tabs .tab-image-holder, #insight-benefits-wrapper #tabs .tab-image-holder img, #insight-benefits-wrapper #tabs .tab-image-holder video { } #insight-benefits-wrapper #tabs .tab-image-holder { flex: 1; } #insight-benefits-wrapper #tabs .tab-content-holder { flex: 1; padding: 0 0 0 40px; } #insight-benefits-wrapper #tabs .tab-content-holder h3 { color: var(--pg-color-surface); font-size: 36px; font-weight: 500; margin-bottom: 0; text-transform: none; } @media (max-width: 992px) { #insight-benefits-wrapper #tabs .tab-content-holder h3 { font-size: 32px; } } @media (max-width: 767px) { #insight-benefits-wrapper #tabs .tab-content-holder h3 { font-size: 28px; } } @media (max-width: 420px) { #insight-benefits-wrapper #tabs .tab-content-holder h3 { font-size: 24px; } } #insight-benefits-wrapper #tabs .tab-content-holder em { font-size: 28px; font-weight: 400; font-style: normal; color: var(--pg-orange); text-transform: uppercase; margin-bottom: 24px; } #insight-benefits-wrapper #tabs .tab-content-holder strong { color: var(--pg-orange); font-weight: 400; } #insight-benefits-wrapper #tabs .tab-content-holder p, #insight-benefits-wrapper #tabs .tab-content-holder li { font-size: 21px; font-weight: 300; color: var(--pg-color-surface); margin-bottom: 12px; } #insight-benefits-wrapper #tabs .tab-content-holder a.cta { font-size: 14px; font-weight: 500; text-decoration: none; color: var(--pg-color-ink); } #insight-benefits-wrapper #tabs .hide { min-height: unset; height: 0; visibility: hidden; overflow: hidden; opacity: 0; } #insight-benefits-wrapper #tabs .show { height: auto; visibility: visible; overflow: unset; opacity: 1; transition: 0.3s linear all; } #insight-benefits-wrapper #tabs .tabContent img { max-width: 400px; width: 100%; height: auto; } #our-customers-wrapper { padding: 70px 0; background-color: var(--pg-color-ink); } .our-customers-slide-wrapper.slick-slide { position: relative; } .our-customers-slide-wrapper .avatar { position: absolute; z-index: 2; left: -70px; top: 50px; border-radius: 8px; } .our-customers-slide { max-width: 970px; position: relative; margin: 50px auto 0; } .our-customers-slide .shape { position: absolute; top: 0; left: 0; width: 100%; z-index: 1; } .testimonial-content { position: relative; min-height: 500px; margin-left: auto; padding: 60px 120px 70px 240px; z-index: 2; } .testimonial-content .company { position: absolute; left: 50%; transform: translateX(-50%); top: -60px; padding: 12px 16px; background-color: var(--pg-orange); border-radius: 16px; max-height: 75px; width: auto; } .testimonial-content .quote { font-size: 28px; font-weight: 300; color: var(--pg-color-surface); line-height: 120%; margin-bottom: 60px; } .testimonial-bottom-part { display: flex; justify-content: space-between; align-items: end; font-size: 21px; } .testimonial-bottom-part .author { flex: 3; } .testimonial-bottom-part .name { font-weight: 700; color: var(--pg-orange); margin-bottom: 0; } .testimonial-bottom-part .job-title { color: var(--pg-orange); margin-bottom: 0; } .testimonial-bottom-part .cta { flex: 3; text-align: right; font-weight: 500; color: var(--pg-orange); text-decoration: none; } #addons-section { padding: 100px 0; background-color: var(--pg-color-ink); } #addons-section h2.title { text-align: center; color: var(--pg-color-surface); font-weight: 500; text-transform: none; font-size: 67px; } @media (max-width: 992px) { #addons-section h2.title { font-size: 48px; } } @media (max-width: 767px) { #addons-section h2.title { font-size: 36px; } } @media (max-width: 420px) { #addons-section h2.title { font-size: 32px; } } #addons-section .addon-box { border-radius: 8px; overflow: hidden; } #addons-section .addon-box img { width: 100%; } #addons-section .addon-box .addon-content { padding: 40px 24px 24px 24px; background-color: var(--pg-color-ink); } #addons-section .addon-box .tag { font-size: 16px; font-weight: 400; margin: 0 0 12px 0; text-transform: uppercase; color: var(--pg-color-muted); } #addons-section .addon-box h3 { font-size: 24px; font-weight: 500; text-transform: none; margin: 0 0 12px 0; color: var(--pg-color-surface); } #addons-section .addon-box .content { font-size: 16px; font-weight: 300; height: 72px; overflow: hidden; color: var(--pg-color-muted); margin: 0 0 18px 0; } #addons-section .addon-box a.cta { font-size: 14px; font-weight: 500; text-decoration: none; color: var(--pg-color-ink); } @media only screen and (min-width: 1921px) { } @media only screen and (max-width: 1440px) { #about-device-section-wrapper { min-height: 620px; } #about-device-section-wrapper:after { content: ''; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-color: rgba(0,0,0,0.4); } #insight-benefits-wrapper #tabs .tab-content-holder { max-width: 640px; width: auto; } .insight-capabilities-content { padding: 100px 0; } } @media only screen and (max-width: 1280px) { #about-device-section-wrapper { min-height: 520px; } .our-customers-slide-wrapper .avatar { left: 40px; top: 80px; width: 150px; } } @media only screen and (max-width: 992px) { #hero-section-wrapper { min-height: unset; padding: 120px 0 60px 0; } #hero-section-wrapper .hero-image { display: none; } #about-device-section-wrapper { min-height: unset; padding: 60px 0; } #insight-capabilities-wrapper .col-content { display: block; } #insight-capabilities-wrapper .col-content img { display: none; } #insight-capabilities-wrapper .col-content p { text-align: center; } #about-device-section-wrapper.big-text .about-device-content { padding: 0; } #insight-benefits-wrapper #tabs .tabContent img { width: 100%; height: auto; } #insight-benefits-wrapper #tabs .tab { padding: 12px; width: 200px; } .testimonial-content { min-height: unset; padding: 30px 30px 0px 110px; } .testimonial-content .quote { margin-bottom: 30px; } #addons-section .addon-box { margin-bottom: 40px; } } @media only screen and (max-width: 768px) { #insight-capabilities-wrapper .col-content { display: flex; } #insight-capabilities-wrapper .col-content img { display: flex; align-self: start; } #insight-capabilities-wrapper .col-content p { text-align: left; margin-bottom: 60px; } #insight-benefits-wrapper #tabs .tab-image-holder img, #insight-benefits-wrapper #tabs .tab-image-holder video { display: block; margin: 0 auto; } #insight-benefits-wrapper #tabs .tabContent img { width: auto; height: 250px; margin: 0 0 30px 0 !important; } #insight-benefits-wrapper #tabs .tab-content-holder { padding: 0; } #insight-benefits-wrapper .tabs-content-navigation { display: block; width: 100%; } #insight-benefits-wrapper #tabs .tab { width: 100%; } #our-customers-wrapper { padding: 0; } .testimonial-content { padding: 150px 0 0 0; } .our-customers-slide .shape { display: none; } .our-customers-slide-wrapper .avatar { top: 0; left: auto; right: 0; } .testimonial-content .company { top: 0; left: 0; transform: none; } .testimonial-content .quote { color: var(--pg-color-surface); margin-bottom: 20px; } .testimonial-bottom-part { display: block; } .testimonial-bottom-part .cta { display: flex; margin-top: 20px; } .testimonial-bottom-part .cta img { margin-right: 10px; } .testimonial-bottom-part p { margin-bottom: 0; } .slick-next, .slick-prev { display: none !important; } } @media only screen and (max-width: 440px) { #insight-benefits-wrapper #tabs .tab { width: 100%; font-size: 14px; padding: 12px 6px; } }
