img { max-width: 100%; } .group-chat-wrap { background: #f5faff; padding: 46px 0; } .banner-heading h1, .banner-heading h1 span, .banner-heading p { font-family: "proxima-nova", sans-serif; font-weight: 400; font-size: 18px; line-height: 28px; margin-top: 0; margin-bottom: 30px; display: inline-block; max-width: 100%; } .lazy { display: inline-block; background-repeat: no-repeat; background-position: 49% 50%; } section#security .heading p { color: #fff; } section#security .heading h4:after { background: #fff; } h1 span.heading-desc { font-family: "proxima-nova", sans-serif; font-weight: 400; font-size: 32px; line-height: 48px; } .banner-heading p { font-family: "proxima-nova", sans-serif; font-weight: 400; font-size: 18px; line-height: 28px; margin-top: 20px; margin-bottom: 0; padding-right: 65px; } .banner-heading .button.talk-to-us { min-width: 199px; font-weight: 600; display: inline-block; overflow: inherit; margin-right: 15px !important; background: #fb7d17; color: #fff; border: 1px solid #f27d19; } .banner-heading .button.secondary { border: solid 1px #fff; background: 0 0; color: #fff; min-width: 199px; box-shadow: 8px 9px 27px 0 rgb(5 122 171 / 25%); font-weight: 600; display: inline-block; margin-top: 20px; } .banner-heading .button.secondary:hover { background: #fb7d17; color: #fff; border: solid 1px transparent; } .banner-heading h1 span.top-head { font-weight: 400; font-family: "proxima-nova", sans-serif; font-weight: 400; font-size: 32px; line-height: 51px; } .banner-heading { color: #000; position: static; padding: 60px 15px 0; } .banner-img-laptop img { width: 100%; height: 100%; max-width: 1020px; max-height: 670px; } .messaging-feasibility ul { display: flex; border-radius: 10px; margin: 60px 0 0; } .messaging-feasibility ul li svg { fill: url(#grd1); } .messaging-feasibility ul li img { height: auto; } .messaging-feasibility ul li { box-shadow: 1px 2px 28px 0 #0000ff14; border: none; flex: 2; padding: 30px 40px 30px; border-radius: 24px; background: #fff; transition: 0.5s all ease; margin-right: 44px; text-align: center; } .messaging-feasibility ul li:last-child { margin-right: 0; } .messaging-feasibility ul li h4 { font-size: 20px; color: #000; line-height: 25px; font-family: "proxima-nova", sans-serif; font-weight: 700; width: 90%; margin: 0 auto; margin: 15px 0; } .messaging-feasibility ul li p { font-size: 16px; margin-top: 15px; line-height: 22px; font-family: "proxima-nova", sans-serif; font-weight: 400; } .messaging-features { position: relative; background: #fff; } span.highlight { color: #0341f0; } .messaging-feasibility { padding: 50px 15px 60px; } .connect-device-content.features-content { display: flex; align-items: center; box-shadow: none; margin: 54px 20px 0; padding: 0 0 0; } .connect-device-content.features-content .first-set { margin-right: 30px; } .connect-device-content .connect-device-solutions { width: 300px; position: relative; background: #fff; margin-bottom: 50px; box-shadow: 1px 2px 28px 0 #0000ff14; border: none; border-radius: 16px; } .connect-to-device .heading p { width: 70%; margin: 0 auto; } .connect-device-content .connect-device-solutions .connect-device-security-content { width: 100%; color: #000; padding: 26px 25px 30px 26px; } .connect-device-content .connect-device-solutions .connect-device-security-content svg { height: 48px; width: 48px; fill: url(#grd1); } .connect-device-content .connect-device-solutions .connect-device-security-content img { height: auto; } .connect-device-content .connect-device-solutions .connect-device-security-content h3 { font-family: "proxima-nova", sans-serif; font-weight: 700; font-size: 18px; line-height: 26px; margin-top: 16px; } .connect-device-content .connect-device-solutions .connect-device-security-content p { font-family: "proxima-nova", sans-serif; font-weight: 400; font-size: 14px; line-height: 22px; width: auto; margin-top: 15px; } .connect-device-content.features-content .second-set { margin-left: auto; } .features-img { text-align: center; margin-top: 20px; z-index: 1; } .connect-device-content .connect-device-solutions .connect-device-security-content i.connect-icons { height: 60px; width: 60px; display: flex; align-items: center; justify-content: center; background: #f8f2ff; border-radius: 100%; } .features-img img.lazy-communication { width: 70%; height: auto; } .features-content { width: 610px; float: left; border-radius: 10px; margin: 60px 20px 0; -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.12); box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.12); padding: 50px 0 58px; z-index: 1; } .same-features .features-communication { display: flex; align-items: center; } .same-features .features-img { width: 100%; } .same-features .connect-device-content.features-content { width: auto; } .same-features .features-img img.lazy-communication { width: 100%; height: auto; } section#live-broadcasting { background: #f5faff; } section#hq-video-calls { background: #fff; } div#group-chat { background: #fff; } .parentsteachers.connecting-std { background: #fff; } .parentsteachers { padding: 46px 0 46px 0; background: linear-gradient(210deg, #00c0ff, #8500d9 0, #00c0ff); } .features-parentsteachers { display: flex; align-items: center; margin-top: 30px; } .features-parentsteachers .features-img, .features-parentsteachers .features-section { margin-top: 0; } .features-parentsteachers .features-img { width: 55%; } .features-parentsteachers .features-section { width: 45%; } .security.parentsteachers .features-parentsteachers .features-img, .security.parentsteachers .features-parentsteachers .features-section { flex: 1; width: 50%; } .features-parentsteachers .features-section h3 { font-family: "proxima-nova", sans-serif; font-weight: 700; margin-bottom: 4px; color: #000; font-size: 26px; line-height: 34px; text-align: left; position: relative; width: 90%; } .features-parentsteachers .features-section h3:before { content: ""; position: absolute; height: 3px; width: 91px; background: #131313; left: 0; top: -25px; display: none; } .features-parentsteachers .features-section p { margin-top: 20px; font-size: 18px; line-height: 32px; } .parentsteachers ul { display: flex; margin-top: 30px; } .parentsteachers ul li { flex: 1; padding: 30px; transition: 1s all ease; position: relative; background: #fff; margin-right: 44px; box-shadow: 1px 2px 28px 0 #0000ff14; border: none; border-radius: 24px; } .parentsteachers ul li:last-child { margin-right: 0; } .parentsteachers ul li svg { width: 52px; height: 52px; fill: url(#grd1); } .parentsteachers ul li img { height: auto; } .parentsteachers ul li h4 { margin: 15px 0; font-size: 18px; font-family: "proxima-nova", sans-serif; font-weight: 600; font-weight: 600; line-height: 26px; color: #000; } .parentsteachers ul li p { font-size: 16px; line-height: 26px; color: #000; } .parentsteachers ul li.hover, .parentsteachers ul li:hover { background: #fff; transition: 0.5s all ease; } .parentsteachers .features-img img.lazy-communication { width: 100%; height: auto; } .parentsteachers.connecting-std .features-parentsteachers { margin-top: 0; align-items: flex-start; margin-bottom: 50px; } .parentsteachers.connecting-std .features-section { margin-top: 70px; } .connecting-std .features-img { margin-right: 65px; } .connecting-std .features-img { margin-right: 65px; } .features-parentsteachers .features-img { margin-left: 30px; } .connecting-std .features-parentsteachers .features-img { margin-left: 0; } .parentsteachers.security { background-size: cover !important; width: 100%; } .parentsteachers.security h2 { color: #fff; } .parentsteachers.security .features-parentsteachers .features-section h3 { color: #fff; } .parentsteachers.security .features-parentsteachers .features-section p { color: #fff; } .parentsteachers.security ul { display: block; } .parentsteachers.security ul li { display: flex; align-items: center; padding: 30px 18px; border: none; background: rgba(255, 255, 255, 0.25); border-radius: 10px; box-shadow: 1px 2px 43px 0 rgba(39, 34, 71, 0.18); transition: 0.5s all ease; margin-bottom: 20px; margin-right: 20px; border: 3px solid #fff; } .parentsteachers.security .features-parentsteachers .features-section h3:before { background: #fff; } .parentsteachers.security ul li svg { width: 70px; height: 70px; } .parentsteachers.security ul li .secutity-list { text-align: left; margin-left: 30px; width: 100%; } .parentsteachers.security ul li h3 { margin: 0 0 10px; color: #fff; } .banner-heading p b { font-weight: 600; } #group-chat ul li { padding: 40px 30px; } .parentsteachers.closed-community ul li { background: #fff; margin-right: 44px; box-shadow: 1px 2px 28px 0 #0000ff14; border: none; border-radius: 24px; } .parentsteachers.closed-community ul li:last-child { margin-right: 0; } .barbottom { position: relative; } #secure-message .barbottom:after { background: #fff; } .banking-message.messaging-feasibility { padding-top: 30px; } .parentsteachers .features-img.bankingexpense-img img { width: auto; height: 460px; } .banner-img-mobile { right: 80px; } .banner-img-mobile img { padding: 20px 0; padding-top: 0; } .banking-features.parentsteachers { padding-bottom: 20px; } .banking-features.parentsteachers ul.bankinglists { margin-top: 0; } .banking-features.parentsteachers ul li:last-child { margin-bottom: 0; } .messaging-feasibility ul.banking li svg { fill: url(#linear-gradient); } .messaging-feasibility ul.banking li:hover svg { fill: #fff; } .parentsteachers.security .heading p { color: #fff; } .parentsteachers.security .heading p:after { background: #fff; } .parentsteachers.security ul li p { color: #fff; } .parentsteachers.connecting-std ul li:after { position: absolute; content: ""; width: 0; height: 4px; left: 50%; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); bottom: 0; background-color: #435ee0; -webkit-transition: all ease 0.8s; -o-transition: all ease 0.8s; transition: all ease 0.8s; border-radius: 10px; } .parentsteachers.security ul li:hover { transform: scale(1.1); } .connect-to-device { padding: 50px 0 60px; position: relative; background: #f5faff; } .connect-to-device .container { overflow: hidden; } .connect-to-device svg.circle { position: absolute; bottom: -50px; right: 0; z-index: -1; } .connect-to-device .tab_container { height: 550px; } .connect-to-device ul.tabs li { height: auto; margin: 0; padding: 20px; flex: 1; } .connect-to-device ul.tabs { border-radius: 10px 10px 0 0; overflow: hidden; } .connect-to-device ul.tabs li.active { background: #435ee0; color: #fff; } .connect-to-device .features-communication { display: flex; align-items: center; } .features-section .features-img { margin: 0; } .features-section .features-img ul li { margin: 0; } .features-parentsteachers .features-section li h4 { margin: 15px 0; font-size: 18px; font-family: "proxima-nova", sans-serif; font-weight: 600; line-height: 26px; color: #000; } .features-parentsteachers .features-section li p { font-size: 16px; line-height: 26px; color: #000; margin-top: 0; } .breakword { padding: 0 230px; } #live-broadcasting ul li h4 { width: 60%; } @media (min-width: 2101px) { .banner-img-laptop img { max-width: 720px; max-height: 800px; } .banner-img-laptop { position: absolute; right: -80px; top: 0; } } @media (min-width: 1367px) and (max-width: 2100px) { .banner-img-laptop img { max-width: 720px; max-height: 800px; } .banner-img-laptop { position: absolute; right: -80px; top: 30px; } } @media (max-width: 1560px) { .banner-img-laptop { top: 30px; right: -20px; } .banner-img-laptop img { max-width: 650px; } } @media (max-width: 1300px) { .banner-img-laptop { top: 30px; } } @media (max-width: 1200px) { .banner-img-laptop img { max-width: 550px; } .banner-img-laptop { right: -20px; } .messaging-feasibility ul li { padding: 20px; } .messaging-feasibility ul li p { font-size: 14px; } .messaging-feasibility ul li h4 { font-size: 16px; } } @media (max-width: 1024px) { .banner-img-laptop img { max-width: 621px; } } @media (max-width: 1099px) { .breakword { padding: 0 90px; } .heading h2, .heading h3 { font-family: "proxima-nova", sans-serif; font-weight: 700; font-size: 30px; line-height: 40px; } .same-features .features-communication { display: block; } .connect-device-content .connect-device-solutions { width: auto; } .same-features .connect-device-content.features-content { width: 100%; margin: 0; } .same-features .features-img { width: 100%; margin-top: 50px; } .same-features .features-img img.lazy-communication { margin: 0 auto; text-align: center; width: 50%; } .parentsteachers ul li h4 { margin: 9px 0; font-size: 16px; } .parentsteachers ul li p { font-size: 14px; line-height: 23px; } .parentsteachers ul li { padding: 15px; } .parentsteachers.security ul li { padding: 15px 18px; } } @media (max-width: 992px) { .security.parentsteachers .features-parentsteachers .features-section { text-align: center; } .parentsteachers ul { margin-top: 20px; } .security.parentsteachers .features-parentsteachers .features-section img { height: auto; margin: 0 auto; text-align: center; } .security.parentsteachers .features-parentsteachers .features-img, .security.parentsteachers .features-parentsteachers .features-section { width: 100%; } .parentsteachers.security .features-parentsteachers { display: block; } .features-parentsteachers .features-img { margin-left: 0; } .parentsteachers.security .features-parentsteachers .features-img ul { display: flex; width: 100%; } .parentsteachers.security ul li { display: block; margin: 0 20px 0 0; flex: 1; text-align: left; } .parentsteachers.security ul li:last-child { margin: 0; } .parentsteachers.security ul li .secutity-list { margin: 0; } .connect-to-device .features-img { display: none; } .connect-device-content.features-content .first-set { display: flex; align-items: flex-start; margin-right: 0; } .connect-device-content.features-content .first-set .connect-device-solutions { margin-right: 30px; } .connect-device-content .connect-device-solutions { flex: 1; } .connect-device-content.features-content { width: 100%; align-items: flex-start; } .banner-img-laptop img { max-width: 430px; } } @media (max-width: 840px) { .messaging-feasibility ul { background: 0 0; display: block; margin: 20px 0; margin-top: 50px; } .messaging-feasibility ul li { margin-bottom: 15px; } .messaging-feasibility ul li h4 { margin-top: 6px; margin: 0 auto; line-height: 1.4; margin-top: 15px; margin-bottom: 15px; width: 70%; } .messaging-feasibility ul li p { margin-top: 12px; } .messaging-feasibility ul li.hover, .messaging-feasibility ul li:hover { border-radius: 10px; } .features-parentsteachers .features-section h3 { font-size: 20px; } .features-parentsteachers .features-section p { margin-top: 6px; font-size: 16px; line-height: 26px; } .messaging-feasibility ul li { margin-right: 0; } } @media (max-width: 768px) { .banner-img-laptop { display: none; } .connecting-std .features-parentsteachers .features-img { order: 2; } .parentsteachers.connecting-std .features-section { order: 1; margin-top: 0; } .parentsteachers.connecting-std .features-parentsteachers { display: flex; flex-direction: column; } .features-parentsteachers .features-section h3 { font-size: 18px; } .features-parentsteachers .features-img, .features-parentsteachers .features-section { width: 100%; margin-top: 20px; } .heading h2, .heading h3 { font-family: "proxima-nova", sans-serif; font-weight: 700; font-size: 21px; line-height: 29px; } .features-parentsteachers { display: block; } .features-parentsteachers .features-img { margin: 0; width: 100%; } .parentsteachers ul { display: block; } .messaging-feasibility { padding: 30px 15px; } .parentsteachers .features-img img.lazy-communication { width: 60%; } .parentsteachers .features-img.bankingexpense-img img { height: auto; } .parentsteachers.security .features-parentsteachers .features-img ul { display: block; } .parentsteachers.security ul li { margin: 0 0 20px; display: flex; } .parentsteachers.security ul li .secutity-list { margin-left: 30px; } .features-parentsteachers .features-section h3:before { display: none; } .parentsteachers ul li, .parentsteachers.closed-community ul li { margin: 0 0 15px; } .connect-device-content.features-content { display: block; margin: 54px 0 0; } .connect-device-content.features-content .first-set { display: block; } .connect-device-content.features-content .first-set .connect-device-solutions { margin: 0 0 20px; } .banner-img-laptop img { display: none; } .connect-to-device .heading p { width: 100%; } .heading.path-one { margin-bottom: 18px; } .path-one:after { bottom: -8px; } .features-parentsteachers .features-section h3 { line-height: 25px; } .parentsteachers.connecting-std .features-section { margin-top: 20px; } #live-broadcasting ul li h4 { width: 100%; } } @media (max-width: 640px) { .banner-heading p { line-height: 25px; } .banner-heading .button.talk-to-us { margin-right: 0 !important; } .breakword { padding: 0; } .banner-heading h1 { font-family: "proxima-nova", sans-serif; font-weight: 300; font-size: 25px; line-height: 36px; } .banner-heading h1 span.top-head { font-family: "proxima-nova", sans-serif; font-weight: 400; font-size: 18px; line-height: 51px; } .banner-heading h1 span { font-family: "proxima-nova", sans-serif; font-weight: 700; font-size: 25px; line-height: 36px; } .banner-heading h1 { margin-bottom: 0; } .banner-heading p { margin-top: 15px; margin-bottom: 0; } .connect-device-content.features-content { display: block; } .connect-device-content.features-content .first-set { margin: 0; } .connect-device-content .connect-device-solutions { margin-bottom: 15px; } .bankingexpense-img .features-section { margin-top: 0 !important; } .features-parentsteachers .features-img .bankinglists { margin-bottom: 20px; } .column-reverse { display: flex !important; width: 100%; flex-direction: column-reverse; } .bankingexpense-img { display: none; } .parentsteachers.connecting-std .features-section.bankingexpense-hints { margin-top: 0; } .banking-features .column-reverse .features-section { margin-bottom: 20px; } .parentsteachers ul li, .parentsteachers.closed-community ul li:last-child { margin-bottom: 15px; } .parentsteachers { padding: 32px 0; } } @media (max-width: 500px) { .parentsteachers.security ul li { display: block; } .parentsteachers.security ul li .secutity-list { margin: 0; } } @media (max-width: 400px) { .banner-content ul li, .parentsteachers .features-img img.lazy-communication { width: 55%; text-align: left; margin: 0 auto 20px; } .banner-heading h1 span { font-family: "proxima-nova", sans-serif; font-weight: 700; font-size: 24px; line-height: 36px; } } @media (max-width: 360px) { .banner-heading h1 span { font-family: "proxima-nova", sans-serif; font-weight: 700; font-size: 21px; line-height: 30px; } .banner-heading h1 span.highlight-color:after { left: 50%; } } @media (min-width: 481px) and (max-width: 768px) { .banner-heading h1 span.highlight-color:after { width: 30px; min-width: 250px; } }