#hero-section-wrapper.collabomate-now { position: relative; min-height: 100vh; } #hero-section-wrapper.collabomate-now .hero-content-wrapper { } #hero-section-wrapper.collabomate-now .hero-content { position: relative; width: fit-content; } #hero-section-wrapper.collabomate-now .hero-content .absolute { position: absolute; left: 60px; top: 35px; right: 60px; } #hero-section-wrapper.collabomate-now .hero-content .absolute img { display: block; max-width: 420px; height: auto; } #hero-section-wrapper.collabomate-now .hero-content .absolute h1 { font-size: 101px; padding: 0; font-weight: 500; text-transform: none; } @media (max-width: 992px) { #hero-section-wrapper.collabomate-now .hero-content .absolute h1 { font-size: 67px; } } @media (max-width: 767px) { #hero-section-wrapper.collabomate-now .hero-content .absolute h1 { font-size: 48px; } } @media (max-width: 420px) { #hero-section-wrapper.collabomate-now .hero-content .absolute h1 { font-size: 36px; } } #hero-section-wrapper.collabomate-now .hero-content .button-row { } .hero-content .subtitle { font-size: 24px; margin-bottom: 0; padding-bottom: 40px; line-height: 36px; font-weight: 300; } .hero-content hr { max-width: 700px; height: 2px; background-color: var(--pg-orange); border: 0; padding: 0; margin: 30px 0; opacity: 1; } #register.collabomate-now { color: var(--pg-color-ink); padding: 100px 0; } #register.collabomate-now h3 { text-align: center; max-width: 900px; margin: 0 auto 40px; color: var(--pg-orange); font-size: 36px; font-weight: 500; text-transform: none; } @media (max-width: 992px) { #register.collabomate-now h3 { font-size: 32px; } } @media (max-width: 767px) { #register.collabomate-now h3 { font-size: 28px; } } @media (max-width: 420px) { #register.collabomate-now h3 { font-size: 24px; } } #register.collabomate-now p { font-size: 21px; margin-bottom: 40px; } #register.collabomate-now ul li { font-size: 21px; } #register img { display: block; max-width: 400px; height: auto; margin: 30px auto 0; } #promote { padding: 100px 0; background-color: var(--pg-color-white); } #promote img { max-width: 100%; } #promote p { font-size: 21px; margin-bottom: 30px; color: var(--pg-color-ink); } #promote a.primary-button { display: inline-block; } #promote p.title { color: var(--pg-color-ink); } #promote p.title span { color: var(--pg-orange); font-weight: 600; } #promote .avatar-box { float: left; text-align: center; width: 50%; } #promote .avatar-box h3 { color: var(--pg-orange); font-size: 36px; font-weight: 500; margin-top: 20px; margin-bottom: 0; text-transform: none; } @media (max-width: 992px) { #promote .avatar-box h3 { font-size: 32px; } } @media (max-width: 767px) { #promote .avatar-box h3 { font-size: 28px; } } @media (max-width: 420px) { #promote .avatar-box h3 { font-size: 24px; } } #promote .avatar-box p { font-size: 14px; } @media only screen and (max-width: 992px) { #promote .avatar-box { float: none; margin: 0 auto; width: unset; } #promote .avatar-box p { font-size: 21px; } } @media only screen and (max-width: 768px) { #hero-section-wrapper.collabomate-now { background: var(--pg-color-ink) !important; } #hero-section-wrapper.collabomate-now .hero-content-wrapper { position: static !important; padding: 0 15px; } #hero-section-wrapper img.vector { display: none; } #hero-section-wrapper.collabomate-now .hero-content .absolute { position: static; } #hero-section-wrapper.collabomate-now .hero-content .absolute img { max-width: 100%; } #register.collabomate-now h3 { font-size: 36px; font-weight: 500; text-transform: none; } @media (max-width: 992px) { #register.collabomate-now h3 { font-size: 32px; } } @media (max-width: 767px) { #register.collabomate-now h3 { font-size: 28px; } } @media (max-width: 420px) { #register.collabomate-now h3 { font-size: 24px; } } #register img { max-width: 100%; } #promote { text-align: center; } #promote .row { flex-direction: column-reverse; } }