html {
font-size: 62.5%;
}
html body {
font-family: 'Oracle Sans';
font-size: 1.4rem;
}
body,
div,
section,
p,
h1,
h2,
h3,
h4,
h5,
h6,
ul,
li {
margin: 0px;
padding: 0px;
}
h1,
h2,
h3,
h4,
h5,
h6 {
font-weight: normal;
}
a {
color: inherit;
text-decoration: none;
}
img {
display: block;
max-width: 100%;
}
strong {
font-weight: normal;
font-family: 'Oracle Sans Bold';
}
.flex {
display: flex;
flex-wrap: wrap;
}
.container {
width: 3000px;
max-width: 100%;
margin: 0 auto;
box-sizing: border-box;
box-shadow: 0px 2px 22px rgba(0, 0, 0, 0.09);
}
.wrap {
width: 1080px;
max-width: 100%;
margin: 0 auto;
}
header {
background: url('../img/hero-large-compressed.jpg') no-repeat;
background-size: cover;
padding-top: 40px;
min-height: 972px;
background-position: calc(50% + 30px) 50%;
}
.header-left {
width: 50%;
}
header h1 {
font-size: 4.2rem;
color: #ffffff;
margin-top: 70px;
}
header h2 {
font-size: 2.3rem;
color: #414141;
}
.form-section {
width: 50%;
max-width: 100%;
padding: 30px;
margin: 45px auto 58px;
background: #ffffff;
box-sizing: border-box;
box-shadow: 0px 2px 22px rgba(0, 0, 0, 0.09);
border-radius: 20px;
/* min-height: 630px; */
}
.form-section .form-group {
width: 100%;
}
.form-section h3 {
padding-left: 45px;
background: url('../img/arrow.png') no-repeat;
background-position: left;
font-family: 'Georgia';
font-style: italic;
color: #0D5371;
font-size: 3rem;
display: block;
margin-bottom: 10px;
}
.form-section p {
font-size: 1.4rem;
color: #275F66;
margin-bottom: 15px;
}
.form-section form {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
}
.form-section label {
color: #312D2A;
font-size: 1.2rem;
}
.form-section input[type="text"],
.form-section select,
.form-section textarea{
background: none;
border: none;
border-bottom: solid 2px #DEE9EF;
width: 100%;
padding: 5px 0;
font-size: 1.7rem;
color: #000;
display: block;
}
.form-section input[type="text"]:focus,
.form-section select:focus,
.form-section textarea:focus{
outline: none;
}
.form-section .form-group {
width: 100%;
margin-bottom: 5px;
}
.form-section .opt-in-section {
width: 100%;
}
.form-section .opt-in-section label,
.optInBlock {
font-size: 1.2rem;
color: #8B8580;
}
form input[type="submit"],
.cta {
margin: 20px auto 0;
font-family: 'Oracle Sans Semi Bold';
font-size: 1.5rem;
text-transform: uppercase;
background-color: #fdb813;
border: 0px;
cursor: pointer;
color: #fff;
display: block;
text-align: center;
padding: 20px 0px;
border-radius: 5px;
width: 300px;
max-width: 100%;
box-sizing: border-box;
}
.features {
width: 1120px;
max-width: 100%;
margin: 0 auto;
padding: 0px 0 40px;
text-align: center;
/* background: url('/c.6262239/portal/common/form/landing_pages/template_assets/MC-12164/images/texture.png') no-repeat; */
background-position: bottom right;
}
.features-para-new-first {
margin-top: -150px;
padding-bottom: 50px;
}
.features .flex-row {
justify-content: space-between;
}
.features h3 {
font-size: 2.5rem;
font-family: 'Oracle Sans Semi Bold';
color: #275F66;
margin-bottom: 25px;
}
.feature {
width: 24%;
font-size: 1.5rem;
color: #666666;
padding: 40px 20px;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.25);
background: #ffffff;
}
.feature img {
margin: 0 auto 20px;
}
.feature h4 {
font-size: 1.7rem;
font-family: 'Oracle Sans Semi Bold';
margin-bottom: 15px;
}
.feature .purple {
color: #8C6B8A;
}
.feature .red {
color: #C94634;
}
.feature .gold {
color: #E0A24F;
}
.feature .turq {
color: #53B9B3;
}
.purple-bottom {
border-bottom: solid 6px #8C6B8A;
}
.red-bottom {
border-bottom: solid 6px #C94634;
}
.gold-bottom {
border-bottom: solid 6px #E0A24F;
}
.turq-bottom {
border-bottom: solid 6px #53B9B3;
}
.testimonials {
text-align: center;
margin-top: 40px;
background: url('../img/bottom-bg-large-Compressed.jpg') no-repeat;
background-position: bottom center;
}
.testimonials h3 {
font-size: 2.5rem;
font-family: 'Oracle Sans Semi Bold';
color: #275F66;
margin-bottom: 25px;
}
.testimonials .flex-row {
align-items: center;
justify-content: space-between;
}
.testimonials p {
margin-bottom: 40px;
}
.testimonials p:nth-child(2) {
margin-bottom: 0;
font-family: 'Oracle Sans Bold';
}
.testimonials img {
width: 33%;
margin-bottom: 40px;
}
.orange {
color: #fdb813;
}
.turq {
color: #03acbb;
}
.testi-wrap {
background: #FFFFFF;
box-shadow: 0px 16px 36px rgba(0, 0, 0, 0.1);
border-radius: 30px;
padding: 40px;
width: 60%;
font-size: 1.8rem;
line-height: 1.5em;
margin-bottom: 40px;
}
.customers {
padding: 60px 0;
}
.customers h3 {
font-size: 2.5rem;
font-family: 'Oracle Sans Semi Bold';
color: #275F66;
margin-bottom: 40px;
text-align: center;
}
.customers .flex {
flex-wrap: wrap;
align-items: center;
justify-content: space-between;
margin-bottom: 40px;
}
.customers img {
max-height: 45px;
margin-bottom: 15px;
}
footer {
background: url('../img/bg_redwood_footer_border.png') repeat-x #3D3D3D;
padding: 45px 0 26px;
color: #A8A8A8;
}
/* About - Start */
.about-wrap .wrap {
width: 980px;
max-width: 100%;
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
}
.about-wrap .wrap>.flex {
justify-content: space-between;
}
.about-wrap {
background: #FBFBFB;
padding: 40px 0;
/* margin: 60px 0; */
}
.about-wrap .about h3 {
text-align: center;
margin-bottom: 30px;
color: #00B2AC;
font-size: 3.2rem;
font-family: 'Georgia';
font-weight: normal;
font-style: italic;
}
.about-wrap .about p {
text-align: center;
font-size: 1.4rem;
line-height: 1.5em;
}
.about-wrap .ab {
width: 30%;
display: flex;
align-items: center;
margin: 20px 0;
}
.about-wrap .ab img {
margin-right: 10px;
}
.about-wrap .ab span {
font-size: 6rem;
font-family: 'Oracle Sans Semi Bold';
}
.about-wrap .ab p {
text-align: left;
}
.about-wrap .ab-purp span {
color: #8B4198;
}
.about-wrap .ab-teal span {
color: #03ACBB;
}
.about-wrap .ab-orange span {
color: #fdb813;
}
.about-wrap .ab-blue span {
color: #0EB4E9;
}
.about-wrap .ab-lime span {
color: #97CA3C;
}
.about-wrap .ab-red span {
color: #ED265D;
}
/* About - End */
@media only screen and (max-width: 1024px) {
.container {
padding: 0;
}
.wrap {
padding: 0 10px;
}
}
@media only screen and (max-width: 920px) {
.header-left {
width: 100%;
text-align: center;
}
.header-left img {
margin: 0 auto;
}
header {
background: #5FBAE3;
}
header h1 {
font-size: 4rem;
}
header h2 {
font-size: 2rem;
}
.form-section {
width: 90%;
}
.form-section .form-group {
width: 100%;
}
.features {
padding-top: 40px;
margin-top: 0;
}
.feature {
width: 90%;
margin: 10px auto;
}
.testi-wrap {
width: 90%;
margin: 10px auto;
}
.testimonials img {
width: 300px;
max-width: 100%;
margin: 10px auto;
}
.customers .flex {
display: block;
}
.customers img {
margin: 5px auto;
}
}
@media only screen and (max-width: 800px) {
.about-wrap .ab {
width: 48%;
}
}
@media only screen and (max-width: 600px) {
.about-wrap .ab {
width: 300px;
margin: 10px auto;
}
}