section.start { text-align: center; color: #fff; background: #23BCBA 0% 0% no-repeat padding-box; } .template-img { margin-right: 6.8rem; } .options { padding-top: 4rem; } .option-row { cursor: pointer; } .option-number { text-align: left; font-weight: 700; font-family: 'Roboto', sans-serif; font-size: 3.25rem; line-height: 1; letter-spacing: 0px; color: #0E6978; opacity: 1; padding: 0rem 1rem; } .option-text { display: flex; align-items: center; text-align: left; font-weight: 300; font-family: 'Roboto', sans-serif; font-size: 1.56rem; line-height: 1.68rem; letter-spacing: 0px; color: #FFFFFF; } .selected { opacity: 1; } .not-selected { opacity: 0.6; } .features-layout { display: flex; justify-content: space-around; padding-bottom: 4rem; } .features-title { display: flex; justify-content: center; font-weight: 700; font-family: 'Roboto', sans-serif; font-size: 2.37rem; padding-bottom: 3rem; color: #212121; opacity: 1; } .feature-subtitle { text-align: center; font-weight: 700; font-family: 'Roboto', sans-serif; font-size: 1.87rem; padding: 1.5rem 0rem; color: #000000; opacity: 0.8; } .feature-img { display: flex; justify-content: center; } .feature-desc { text-align: center; font-size: 1rem; color: #292747; opacity: 1; max-width: 429px; } section.benefits { background: #F3F3F3 0% 0% no-repeat padding-box; opacity: 1; } .section-title-1 { text-align: center; font-weight: 300; font-family: 'Roboto', sans-serif; font-size: 2.37rem; color: #212121; } .section-title-2 { text-align: center; font-weight: 700; font-family: 'Roboto', sans-serif; font-size: 2.37rem; color: #212121; } .section-title-3 { text-align: left; font-weight: 300; font-family: 'Roboto', sans-serif; font-size: 2.37rem; color: #212121; } .benefit-card { width: 370px; height: 378px; background: #FFFFFF 0% 0% no-repeat padding-box; box-shadow: 0px 6px 15px #0000001A; border-radius: 36px; opacity: 1; margin-bottom: 0.5rem; } .benefit-card-title { text-align: center; font-weight: 300; font-family: 'Roboto', sans-serif; font-size: 1.68rem; color: #292747; opacity: 1; padding: 2.81rem 0rem 1.5rem 0rem; } .benefit-desc { text-align: center; color: #292747; max-width: 226px; } .benefit-desc-1 { text-align: center; color: #292747; max-width: 250px; } .benefit-card hr { width: 286px; border: 1px solid #DBDBDB; opacity: 1; margin-top: 1.5rem !important; margin-bottom: 1.5rem !important; } .benefit-card-subtitle { text-align: left; font-weight: 400; font-family: 'Roboto', sans-serif; font-size: 0.87rem; color: #292747; padding-left: 10px; } .benefit-card-sub-color { text-align: left; font-weight: 400; font-family: 'Roboto', sans-serif; font-size: 0.87rem; color: #008887; } .benefit-ic { margin-left: 40px !important; margin-bottom: .8rem; } .branding-logo { display: flex; align-items: flex-end; } .co-branding-text { text-align: left; font-family: 'Roboto', sans-serif; font-weight: 300; font-size: 1rem; color: #212121; opacity: 0.81; max-width: 357px; padding-top: 1.5rem; } .media-kit-logo-title, .moo-card-logo-title { text-align: left; font-weight: 300; font-family: 'Roboto',sans-serif; font-size: 1.25rem; letter-spacing: 0px; color: #212121; opacity: 0.81; } .co-branding p, .user-guide p, .media-kit p { text-align: left; font-family: 'Roboto', sans-serif; font-weight: 400; font-size: 0.87rem; line-height: 1.6rem; letter-spacing: 0px; color: #212121; opacity: 0.8; padding: 2rem 0rem; } .list { font-size: 0.87rem; color: #212121; opacity: 0.8; } section.media-kit-logo { background: #F3F3F3; opacity: 1; } @media (min-width: 768px) { section.start, section.features, section.co-branding, section.user-guide, section.media-kit .footer { padding-top: 6rem; padding-bottom: 5.4rem; } section.benefits { padding-top: 3.8rem; padding-bottom: 5.4rem; } section.contact { padding-top: 2.8rem; padding-bottom: 0.5rem; } section.how-it-works { padding-top: 2.8rem; padding-bottom: 3.8rem; } section.media-kit-logo, section.moo-cards { padding-top: 4rem; padding-bottom: 5rem; } .footer { padding-top: 4.8rem; padding-bottom: 2rem; } }