x
x
x
x
Only portrait mode is currently supported - please rotate your device.
Show If | ||
---|---|---|
|
HTML |
---|
<style> label.checkbox { display: flex; align-items: center; } input#checkbox { margin-right: 15px; cursor: pointer; } #content-container2 p.title { margin-bottom: 20px; font-family: Arimo; width: 60%; font-size: 22px; line-height: 1.36; text-align: left; color: #ffffff; } .resources-card-sub-description { font-family: Arimo; font-size: 16px; color: white; } .featureCards { display: flex; justify-content: space-around; flex-grow: 1; } .perkCards { display: flex; justify-content: space-around; flex-grow: 1; transform: translate3d(600px, 0, 0); } #content-container4 p.title { font-family: Arimo; font-size: 32px; line-height: 1.36; text-align: left; color: #ffffff; width: 60%; } .carousel-arrow { width: 47px; height: 47px; box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.2); background-color: #ffffff; border-radius: 50%; display: flex; justify-content: center; align-items: center; cursor: pointer; color: #0698f0; align-self: center; } a:hover { color: unset !important; text-decoration: unset !important; } .form-container .form input { font-family: Arimo; font-size: 16px; color: black; padding: 0px 20px; } .form-container .form input:focus { outline: none; } #content-container3 .card { width: 150px; background: white; margin-right: 25px; margin-top: auto; margin-bottom: auto; } #content-container3 .card .container .title { font-size: 1.8vw; font-family: 'Arimo'; font-weight: bold; line-height: 0.52; letter-spacing: normal; color: #0698f0; } div#perks-container { display: flex; padding: 20px; justify-content: space-around; background-color: white; overflow: hidden } #custom-footer{ display:none !important; } #rw_wrapper #main-content.wiki-content{ padding-bottom: 0px; } .sign-up-page{ background: rgb(2,50,79); background: linear-gradient(91deg, rgba(2,50,79,1) 3%, rgba(2,99,158,1) 100%); padding: 60px 0px; } .sign-up-page .content-container{ margin: auto; margin-top: 50px; padding-bottom: 0px; width: 90%; } #content-container3 .title { font-family: Arimo; font-size: 21px; font-weight: bold; line-height: 2.33; color: #ffffff; padding-top: 20px; margin-bottom: 20px; } #content-container1{ display: flex; width: 90%; margin: 0 auto; } #content-container1 .content{ display: flex; align-items: flex-start; flex-direction: column; width: 65%; } #content-container1 img{ width: 20vw; } #content-container1 .title span.bold { font-weight: bold; } #content-container1 .title{ width: 631px; margin: 7px 0 0; font-family: Arimo; font-size: 32px; font-stretch: normal; font-style: normal; line-height: 1.36; letter-spacing: normal; text-align: left; color: #ffffff; } span.special{ color: #0698f0; } #content-container2{ width: 90%; height: auto; } #content-container2 .content{ padding: 40px 0px; } .resources-card { display: flex; margin-bottom: 25px; } .resources-card img { width: 35px; } .resources-card-title { font-family: Arimo; font-size: 21px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: 1.38; letter-spacing: normal; color: #0698f0; } .resources-card-left { background: #f3f9fc; width: 45px; border-radius: 50px; display: flex; flex-direction: column; align-items: center; justify-content: center; } .resources-card-right { padding-left: 20px; } .resources-card-description { font-family: Arimo; font-size: 21px; font-weight: bold; font-stretch: normal; font-style: normal; line-height: 1.38; letter-spacing: normal; color: white; }; #content-container3{ width: 90%; height:auto; box-shadow: 2px 2px 16px 0 rgba(0, 0, 0, 0.2); background-color: #02324f; } .testimonial-container { display: flex; flex-direction: column; padding: 70px 50px; width: 50%; } .testimonial-container .heading p { font-family: Arimo; font-size: 25px; font-weight: bold; line-height: 0.87; letter-spacing: 0.32px; color: #0698f0; margin-bottom: 30px; } .testimonial-container .left { display: flex; flex-direction: column; width: auto; align-items: center; } .testimonial-container .body { display: flex; color: white; } .testimonial-container .body .left img { border-radius: 50%; width: 150px } .testimonial-container .right { display: flex; padding-left: 40px; font-family: Arimo; font-size: 25px; font-weight: bold; line-height: 1.59; color: #ffffff; } .testimonial-container .left .rating { color: #0698f0; margin-top: 20px; } .testimonial-container .body .left .name { font-weight: bold; color: #0698f0; font-family: Arimo; font-size: 15px; line-height: 1.4; letter-spacing: 0.32px; text-align: right; } .testimonial-container .body .left .description { font-weight: bold; color: white; font-family: Arimo; font-size: 15px; line-height: 1.4; letter-spacing: 0.32px; text-align: center; } .form-container .header .existing-account span a { color: #0698f0; } .form-container{ width: 400px; display: flex; flex-direction: column; padding: 40px 20px; box-shadow: 2px 2px 16px 0 rgba(0, 0, 0, 0.12); background-color: #ffffff; height: auto; justify-content: space-around; } .form-container .header{ margin-bottom: 50px; } .form-container .header .heading{ font-family: Arimo; font-size: 32px; font-weight: bold; color: #000000; } .form-container .header .existing-account{ font-family: Arimo; font-size: 14px; color: #0698f0; text-decoration: underline; } .form-container .header .existing-account span{ font-weight: bold; } .form-container .form .input-label{ font-family: Arimo; font-size: 14px; font-weight: bold; color: #000000; } .form-container .form input{ width: 90%; height: 49px; margin-bottom: 20px; margin-top: 10px; box-shadow: 2px 2px 16px 0 rgba(0, 0, 0, 0.12); background-color: #ffffff; border: unset; } .form-container { position: fixed; right: 4%; z-index: 1; top: 170px; } .form-container .footer{ display: flex; width: 90%; justify-content: flex-end; } .form-container .footer button{ width: 110px; height: 40px; margin-top: 20px; background-color: #0698f0; border: unset; font-family: Arimo; font-size: 16px; font-weight: bold; color: #ffffff; cursor: pointer; outline: none; } .err-msg{ pointer-events: none; color: red; margin-top: 2px; } #signup-spinner{ display: none; margin-right: 10px; } /* ================================================================= MOBILE STYLING ================================================================= */ @media only screen and (max-width: 480px) and (min-width: 320px){ #content-container4 p.title{ font-size: 18px; } #content-container3 .card { width: 18vw; } div#content-container3 { height: auto; } .perkCards { display: grid; grid-template-columns: repeat(auto-fill, 68px); grid-column-gap: 12px; grid-row-gap: 12px; width: 100%; justify-content: center; transform: unset; } div#perks-container{ padding: 10px; } #content-container1 img{ width: 60vw; display: none; } #content-container1 .title{ font-size: 24px; width: 350px; } #content-container2 .content{ padding : 40px 10px; } .sign-up-page .content-container{ margin-top: 20px; } .form-container { position: unset; right: unset; z-index: unset; top: unset; width: 80vw; margin: auto; margin-top: 20px; } .container { position: unset; width: unset; height: unset; text-align: center; top: unset; margin: unset; font-family: Arimo; } .featureCards{ justify-content: space-between; } .testimonial-container .body{ flex-direction: column; } .container{ height: unset; } .testimonial-container{ width: unset; } .testimonial-container .heading p{ text-align: center; font-size: 22px; line-height: 1.6; } .testimonial-container .right{ font-size: 18px; padding: unset; font-weight: unset; text-align: center; margin-top: 20px; } .carousel-arrow{ display: none; } #content-container1 .content{ width: 75%; top: 25%; } .form-container .form input{ width: 80%; -webkit-appearance: none; } } </style> <link href="https://fonts.googleapis.com/css2?family=Arimo:wght@400;700&display=swap" rel="stylesheet"> |
...
OneValley