.homepage-container { font-family: Roboto; } .home-row { display: flex; flex-direction: row; } .home-col-50 { display: flex; flex-direction: column; width: 50%; } .pad-2 { padding: 2rem 0.5rem; } a { font-family: Roboto; } .card-image-container { display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: #fff; } .card-image { border-radius: 15px; height: 90%; width: 90%; } ul.navbar-nav { margin-left: auto; } section.section-1:before { content: ""; background: url("../Assets/Images/overlayFlipSmall.png") no-repeat fixed 0% 290px; background-attachment: local; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1; pointer-events: none; } .homepage-button { color: white; z-index: 2; } section.section-1 { height: 680px; display: flex; background-position: center; background-repeat: no-repeat; background-size: cover; } .first-section-subcontainer { padding-top: 35px; padding-left: 20px; } .heading-one-container { padding: 20px 0px 10px 0px; max-width: 590px; } .text-block-1 { padding: 20px 0px; } .upper-row-one { padding-left: 16px; } .section-2 { display: flex; flex-direction: row; width: 100%; padding-top: 2.2rem; } .section-two-body { font-size: 15px; margin: 10px 0px !important; } .home-link-box { display: flex; flex-direction: column; justify-content: flex-end; float: right; padding-right: 15px; margin-right: 15px; } .card-link-box { display: flex; flex-direction: column; justify-content: flex-end; float: right; padding-right: 8px; color: #4675c3; a { font-size: 18px; font-weight: 600; cursor: pointer; color: #4675c3; } a:hover { text-decoration: underline; } } .text-block-two { font-family: Roboto; color: #fff; padding: 20px 0px 10px 0px; font-size: 24px; font-weight: 100; max-width: 370px; line-height: 29px; text-align: justify; } h1.heading-1 { color: #fff; font-family: Roboto; font-size: 40px; font-style: normal; font-weight: 500; line-height: 52px; /* 140.625% */ margin-bottom: 1rem !important; } p.text-block-1 { color: #fff; font-family: Roboto; font-size: 28px; font-style: normal; font-weight: 400; line-height: 29.756px; /* 123.983% */ width: 525.308px; } .try-it-button-box { margin: 20px 0px; padding: 20px 0px 0px 0px; } .heading-2-mobile { display: none; } .try-it-button-box > button { font-size: 1.15rem; width: 200px; height: 55px; } button.button-1 { width: 225.459px; height: 65.234px; /* flex-shrink: 0; */ background: #4675c3; color: #fff; text-align: center; font-family: Roboto; font-size: 18.311px; font-style: normal; font-weight: 400; line-height: normal; text-transform: capitalize; border-radius: 15px; border: 1px solid #fff; } img.img-2 { width: 100%; } h2.heading-2 { color: #757575; font-family: Roboto; font-size: 30px; font-style: normal; font-weight: 600; line-height: 38px; /* 250% */ letter-spacing: 0.369px; margin-bottom: 12px !important; } p.text-block-2 { font-family: Roboto; font-size: 18px; font-style: normal; font-weight: 500; line-height: 30px; /* 125% */ letter-spacing: 0.369px; margin-bottom: 6px !important; } .heading-6-mobile { display: none; margin-bottom: 0.9rem; } .home-text-center { width: 1080px !important; } a.link { font-family: Roboto; color: #4675c3; font-size: 19.677px; font-style: normal; font-weight: 700; line-height: normal; margin: 8px 0px; } a.link:hover { text-decoration: underline; cursor: pointer; } img.img-1 { padding-left: 13px; } .section-3 { min-height: 680px; font-family: Roboto; background-color: var(--background-blue); margin: 20px 0px 30px 0px; } h2.heading-3 { color: #757575; text-align: center; font-family: Roboto; font-size: 24px; font-style: normal; font-weight: 400; line-height: 36px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; } p.text-block-2.text-center { color: #90a3b4; text-align: center; font-family: Roboto; font-size: 17px; font-style: normal; font-weight: 400; line-height: 30px; /* 125% */ letter-spacing: 0.369px; } p.text-block-2.text-center { width: 1030px; } .card-body { border-radius: 0px 0px 12.336px 12.336px; background: #fff; box-shadow: 25px 0 20px -20px rgba(199, 199, 208, 0.271); padding: 16px 18px; } .card-upper-box { display: flex; flex-direction: row; justify-content: center; align-items: center; } .card-img, .card-img-bottom { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } p.card-texts { color: #90a3b4; font-family: Roboto; font-size: 14px; font-style: normal; font-weight: 400; line-height: 23px; /* 125% */ letter-spacing: 0.369px; padding: 0 0 8px 0px; text-align: justify; text-justify: auto; } .foo-card-title { font-family: Roboto; font-size: 1.5rem; font-weight: 500; margin-top: 8px; letter-spacing: -0.009rem; } img.card-img { border-radius: 12.34px 12.34px 0px 0px; padding-bottom: 18px; background: white; } p.card-title { color: #757575; font-family: Roboto; font-size: 18px; font-style: normal; font-weight: 400; line-height: 38px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; padding-top: 30px; } .d-flex.div-block-2 > .d-flex { width: 50%; align-items: center; gap: 10px; } .d-flex.div-block-2 { flex-wrap: wrap; gap: 17px 0; justify-content: center; align-items: center; padding: 43px 0; } .home-card-text-box { padding: 8px 10px 0px 10px; width: 270px; height: 150px; border-right: 1px solid var(--ultra-light-accent); border-bottom: 1px solid var(--ultra-light-accent); border-left: 1px solid var(--ultra-light-accent); border-radius: 0px 0px 10px 10px; } .home-card-divider { width: 80%; margin-top: -10px; margin-bottom: 4px; } p.text-block-3 { color: #90a3b4; font-family: Roboto; font-size: 20px; font-style: normal; font-weight: 400; line-height: 30px; /* 125% */ letter-spacing: 0.369px; padding-left: 13px; margin: 0; padding: 18px 0; } p.text-block-2.text-center { /* background: aqua; */ padding: 0; width: 76%; margin: auto; padding-bottom: 50px; } .card-section-container { display: flex; flex-direction: row; justify-content: space-evenly; margin: 0px 10px; padding: 0px 10px; } h4.heading-4 { color: #7ea4d8; font-family: DM Sans; font-size: 18.615px; font-style: normal; font-weight: 700; line-height: 27.221px; /* 144.444% */ letter-spacing: 0.18px; } section.section-2.pt-5 { padding-bottom: 54px; } h3.heading-5 { color: #757575; font-family: Roboto; font-size: 28px; font-style: normal; font-weight: 400; line-height: 41px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; width: 100%; } .d-flex.star-flex { align-items: center; gap: 4px; padding-left: 14px; } p.text-block-4 { color: #90a3b4; font-family: Roboto; font-size: 20px; font-style: italic; font-weight: 300; line-height: 26px; /* 125% */ letter-spacing: 0.369px; padding-left: 60px; } .d-flex.div-block-1 { align-items: center; gap: 16px; padding-left: 57px; } .section-three-header-box { display: flex; flex-direction: column; align-items: center; margin: 0.5rem 0rem; padding: 1rem; } .section-three-header { font-size: 30px; font-family: Roboto; letter-spacing: 0.09px; align-items: center; justify-content: center; margin: 12px auto 0px auto; color: #757575; letter-spacing: -0.09rem; } .section-three-subhead { font-size: 20px; font-weight: 400; margin: 0.5rem 0rem; } h4.heading-5 { color: #4675c3; font-family: DM Sans; font-size: 22.586px; font-style: normal; font-weight: 700; line-height: 27.103px; /* 120% */ letter-spacing: 0.226px; } p.text-block-5 { margin: 0; color: #90a3b4; font-family: DM Sans; font-size: 18.069px; font-style: normal; font-weight: 400; line-height: 31.621px; /* 175% */ } h4.heading-6 { color: #fff; font-family: Roboto; font-size: 28px; font-weight: 500; line-height: 40px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; } h6.heading-7 { color: #fff; font-family: DM Sans; font-size: 16px; font-style: normal; font-weight: 500; line-height: 36.197px; /* 228.571% */ letter-spacing: 0.339px; } .foo-heading { font-family: Roboto; color: #fff; font-size: 1.1rem; font-weight: 400; } .d-flex.div-block-3 { align-items: center; gap: 20px; } .d-flex.div-block-3 a { text-decoration: none; color: #fff; font-family: DM Sans; font-size: 15.836px; font-style: normal; font-weight: 500; line-height: 36.197px; /* 228.571% */ letter-spacing: 0.339px; text-decoration-line: underline; } .col-md-6.d-flex { align-items: center; flex-wrap: wrap; justify-content: center; } button.button-2 { width: 375px; height: 65px; border-radius: 8px; background: #4675c3; border: 0; color: #fff; text-align: center; font-family: Roboto; font-size: 18px; font-weight: 400; line-height: normal; margin: 6px; text-transform: capitalize; } .home-test-container { /* height: 407.213px; */ /* flex-shrink: 0; */ width: 90%; display: flex; align-items: center; justify-content: space-around; padding: 76px 83px; background-position: center; //background-size: cover; border-radius: 9.049px; background-color: #ffb571; background-repeat: no-repeat; } .heading-6-mobile { display: none; } .home-card { display: flex; flex-direction: column; justify-content: center; align-items: center; width: 300px; height: 480px; background-color: #fff; border-radius: 10px; box-shadow: 0 60px 80px rgba(0, 0, 0, 0.6), 0 45px 26px rgba(0, 0, 0, 0.14); } .home-card-title { display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #f2f2ff; width: 100%; border-radius: 10px 10px 0px 0px; } footer.footer { background: #4675c3; padding: 78px 0 9px 0px; } p.text-block-6 { color: #fff; font-family: DM Sans; font-size: 21.054px; font-style: normal; font-weight: 400; line-height: 36.844px; /* 175% */ } .d-flex.iconFlex { gap: 17px; } h3.heading-8 { color: #fff; font-family: DM Sans; font-size: 23.686px; font-style: normal; font-weight: 700; line-height: normal; padding-bottom: 18px; } a.footer-Link { color: #fff; font-family: DM Sans; font-size: 21.054px; font-style: normal; /* font-weight: 400; */ line-height: normal; padding-bottom: 23px; margin-bottom: 0; display: block; text-decoration: none; } hr { margin: 3rem 0; color: inherit; border: 0; border-top: 3px #8caada solid; opacity: 0.25; background: aqua; } p.footerCopyRight { color: #fff; text-align: center; font-family: DM Sans; font-size: 21.054px; font-style: normal; font-weight: 700; line-height: normal; } a.nav-link.button-1 { background: #4675c3; padding: 13px 0; width: 87px; text-align: center; width: 125px; height: 50px; flex-shrink: 0; color: #fff; text-align: center; font-family: Roboto; font-size: 18.311px; font-style: normal; font-weight: 400; line-height: normal; text-transform: capitalize; margin-left: 38px; } section.section-5.py-5 { display: flex; flex-direction: column; align-items: center; justify-content: center; margin: auto; } li.nav-item { padding: 0 19px; } @media only screen and (max-width: 430px) { ul.navbar-nav { margin-left: auto; } .logo-container { margin-left: -24px; } .first-section-subcontainer { padding-top: 4px; padding-left: 0px; } .try-it-button-box { align-items: end; margin-top: -24px; } .upper-row-one { padding-left: 10px; } .text-block-1 { visibility: hidden; } .text-block-two { visibility: hidden; } section.section-1 { height: 50vh; display: flex; align-items: flex-start; background-position: center; background-repeat: no-repeat; background-size: cover; border-radius: 10px; } section.section-1:before { display: none; } .section-2 { display: flex; flex-direction: column; width: 100%; padding-top: 2.2rem; } .home-row { flex-direction: column; } h1.heading-1 { color: #fff; font-family: Roboto; font-size: 27px; font-style: normal; font-weight: 400; line-height: 32px; /* 140.625% */ text-transform: capitalize; } p.text-block-1 { color: #fff; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 400; line-height: 18.756px; /* 123.983% */ width: 100%; padding: 10px 0 !important; } .home-col-50 { width: 100%; } .heading-2 { display: none; } .heading-2-mobile-box { display: flex; flex-direction: column; justify-content: center; margin-left: auto; margin-right: auto; margin-bottom: 0.5rem; } .pad-2 { padding-top: 0rem; padding-bottom: 0rem; } .heading-2-mobile { display: flex; font-size: 1.365rem; } button.button-1 { width: 151.459px; height: 38.234px; /* flex-shrink: 0; */ background: #4675c3; color: #fff; text-align: center; font-family: Roboto; font-size: 14.311px; font-style: normal; font-weight: 400; line-height: normal; text-transform: capitalize; border: 0; margin-bottom: 18px; } img.img-2 { height: 100%; flex-shrink: 0; width: 101%; } h2.heading-2 { color: #757575; font-family: Roboto; font-size: 25px; font-style: normal; font-weight: 400; line-height: 32px; /* 250% */ letter-spacing: 0.369px; text-transform: capitalize; margin-bottom: 12px !important; } .text-block-2-box { display: flex; flex-direction: column; justify-content: center; margin: auto; align-items: center; } p.text-block-2 { color: #000; font-family: Roboto; font-size: 1rem; font-style: normal; font-weight: 400; line-height: 25px; /* 125% */ letter-spacing: 0.369px; } .section-two-body { color: #78838d; font-size: 0.9rem; text-align: justify; } a.link { color: #4675c3; font-family: Roboto; font-size: 13.677px; font-style: normal; font-weight: 700; line-height: normal; text-decoration: none; cursor: pointer; } .card-section-container { display: flex; flex-direction: column; justify-content: center; align-items: center; margin-left: auto; margin-right: auto; } img.img-1 { padding-left: 6px; width: 27px; } .home-card { margin-bottom: 28px; } section.section-3 { min-height: 680px; background: #eef4f5; } .section-three-header { font-size: 21px; } .section-three-subhead { display: none; } .home-card-text-box { width: 100%; border: none; } .home-link-box { margin-right: 0px; } h2.heading-3 { color: #757575; text-align: center; font-family: Roboto; font-size: 17px; font-style: normal; font-weight: 400; line-height: 27px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; } p.text-block-2.text-center { color: #90a3b4; text-align: center; font-family: Roboto; font-size: 14px; font-style: normal; font-weight: 400; line-height: 24px; /* 125% */ letter-spacing: 0.369px; } p.text-block-2.text-center { width: 1030px; } .card-body { border-radius: 0px 0px 12.336px 12.336px; background: #fff; box-shadow: none; padding: 16px 18px; width: 270px; } .card-img, .card-img-bottom { border-bottom-right-radius: 0; border-bottom-left-radius: 0; } p.card-texts { color: #90a3b4; font-family: Roboto; font-style: normal; font-weight: 400; letter-spacing: 0.369px; font-size: 0.9rem; line-height: 1.4rem; padding: 0 0 8px 0px; } h3.card-title { color: #757575; font-family: Roboto; font-size: 18px; font-style: normal; font-weight: 400; line-height: 23px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; padding-bottom: 13px; } .heading-6-mobile { display: flex; color: #fff; } img.card-img { border-radius: 12.34px 12.34px 0px 0px; padding-bottom: 18px; background: white; } p.card-title { color: #757575; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 400; line-height: 25px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; padding-top: 30px; } .d-flex.div-block-2 > .d-flex { width: 100%; align-items: center; gap: 10px; } .d-flex.div-block-2 { flex-wrap: wrap; gap: 0px 0; justify-content: center; align-items: center; padding: 0 0; padding-top: 20px; } p.text-block-3 { color: #90a3b4; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 400; line-height: 24px; /* 125% */ letter-spacing: 0.369px; padding-left: 13px; margin: 0; padding: 13px 0; } p.text-block-2.text-center { /* background: aqua; */ padding: 0; width: 100%; margin: auto; padding-bottom: 44px; } h4.heading-4 { color: #7ea4d8; font-family: DM Sans; font-size: 16.615px; font-style: normal; font-weight: 700; line-height: 24.221px; /* 144.444% */ letter-spacing: 0.18px; margin-top: 20px; } section.section-2.pt-5 { padding-bottom: 54px; } h3.heading-5 { color: #757575; font-family: Roboto; font-size: 20px; font-style: normal; font-weight: 400; line-height: 26px; /* 156.25% */ letter-spacing: 0.369px; text-transform: capitalize; margin-bottom: 18px; } .d-flex.star-flex { align-items: center; gap: 4px; padding-left: 12px; } p.text-block-4 { color: #90a3b4; font-family: Roboto; font-size: 14px; font-style: italic; font-weight: 300; line-height: 18px; /* 125% */ letter-spacing: 0.369px; padding-left: 60px; } .d-flex.div-block-1 { align-items: center; gap: 16px; padding-left: 57px; } img.img-2 { } .home-test-container { padding: 24px; } h4.heading-5 { color: #4675c3; font-family: DM Sans; font-size: 17.586px; font-style: normal; font-weight: 700; line-height: 16.103px; /* 120% */ letter-spacing: 0.226px; } p.text-block-5 { margin: 0; color: #90a3b4; font-family: DM Sans; font-size: 13.069px; font-style: normal; font-weight: 400; line-height: 19.621px; /* 175% */ } h4.heading-6 { display: none; } h6.heading-7 { color: #fff; font-family: DM Sans; font-size: 13.836px; font-style: normal; font-weight: 500; line-height: 36.197px; /* 228.571% */ letter-spacing: 0.339px; } a { } .d-flex.div-block-3 { align-items: center; gap: 18px; margin-bottom: 17px; } .d-flex.div-block-3 a { text-decoration: none; color: #fff; font-family: DM Sans; font-size: 15.836px; font-style: normal; font-weight: 500; line-height: 36.197px; /* 228.571% */ letter-spacing: 0.339px; text-decoration-line: underline; } .col-md-6.d-flex { align-items: center; flex-wrap: wrap; justify-content: center; } .foo-heading { font-size: 1rem; text-align: justify; margin: 1.1rem 0rem; } button.button-2 { width: 238px; height: 46px; flex-shrink: 0; border-radius: 8px; background: #4675c3; border: 0; color: #fff; text-align: center; font-family: Roboto; font-size: 16px; font-style: normal; font-weight: 400; line-height: normal; text-transform: capitalize; margin-bottom: 11px; } .container.bg-color { /* height: 407.213px; */ /* flex-shrink: 0; */ display: flex; align-items: center; justify-content: space-around; padding: 58px 17px; background-position: center; background-size: cover; border-radius: 9.049px; background: #ffb571; background-repeat: no-repeat; } footer.footer { background: #4675c3; padding: 35px 0 9px 0px; } p.text-block-6 { color: #fff; font-family: DM Sans; font-size: 16.054px; font-style: normal; font-weight: 400; line-height: 24.844px; /* 175% */ } .d-flex.iconFlex { gap: 17px; margin-bottom: 15px; } h3.heading-8 { color: #fff; font-family: DM Sans; font-size: 20.686px; font-style: normal; font-weight: 700; line-height: normal; padding-bottom: 18px; } a.footer-Link { color: #fff; font-family: DM Sans; font-size: 16.054px; font-style: normal; /* font-weight: 400; */ line-height: normal; padding-bottom: 11px; margin-bottom: 0; display: block; text-decoration: none; } hr { margin: 3rem 0; color: inherit; border: 0; border-top: 3px #8caada solid; opacity: 0.25; background: aqua; } p.footerCopyRight { color: #fff; text-align: center; font-family: DM Sans; font-size: 16.054px; font-style: normal; font-weight: 700; line-height: normal; } a.nav-link.button-1 { background: #4675c3; padding: 10px 0; width: 87px; text-align: center; width: 133px; height: auto; flex-shrink: 0; color: #fff; text-align: center; font-family: Roboto; font-size: 18.311px; font-style: normal; font-weight: 400; line-height: normal; text-transform: capitalize; margin-left: auto; margin-right: auto; } .bottom-header-box { display: flex; flex-direction: column; align-items: center; text-align: center; margin: auto; } li.nav-item { padding: 0 19px; text-align: center; } a.navbar-brand > img { width: 151px; } .card { margin-bottom: 17px; } section.section-4.py-5 { padding: 15px 0 !important; } section.section-5.py-5 { padding: 14px 11px !important; } a.logo > img { width: 148px; margin-bottom: 14px; } .col-md-2.col-6.col-2-footer { margin: 20px 0 0 0; } }