diff --git a/src/scss/_featured.scss b/src/scss/_featured.scss index c07bea5..71889c7 100644 --- a/src/scss/_featured.scss +++ b/src/scss/_featured.scss @@ -113,7 +113,7 @@ body.rwavw-custom { rgba($bg-color, 1) ); opacity: 0.4; - border-radius: 25px; + // border-radius: 25px; } .pure-g > div:last-child .row-group::before { @@ -154,7 +154,7 @@ body.rwavw-custom { background-color: rgba(0, 10, 56, 0.05); margin-left: -22px; padding: 0 22px; - border-radius: 22px; + // border-radius: 22px; line-height: 42px; height: 44px; @@ -166,7 +166,7 @@ body.rwavw-custom { rgba($accent-500, 0.8) ); - box-shadow: 4px 4px 6px rgba($accent-500, 0.25), -4px -4px 9px rgba(#fff, 0.75); + box-shadow: 4px 4px 6px rgba(47, 28, 4, 0.25), 2px 2px 4px rgba(#fff, 0.25) inset; svg { position: relative; @@ -485,10 +485,14 @@ body.rwavw-custom { .pure-g > .pure-u-1 { position: relative; + &:last-child { + padding-left: 15; + } + .heading-col-title { font-size: 18px; font-weight: 600; - margin: 110px 0 22px; + margin: 110px 0 44px; opacity: 0.8; } @@ -504,19 +508,44 @@ body.rwavw-custom { transform: translateX(-50%) !important; height: 88px; width: 88px; - opacity: 0.4; + opacity: 0.7; + color: $accent-500; + } + } + } + + @media (min-width: 64em) { + .pure-g > .pure-u-1 { + .heading-col-title { + margin: 77px 0 44px; + } + + p svg { + width: 55px; + height: 55px; } } } } .widget.rwavw-feature-extras { + > div.colors-d { + background: linear-gradient( + to right, + rgba($neutral-900, 1), + rgba($neutral-900, 0.92), + rgba($neutral-900, 1), + ); + } + p, .heading-section-title { color: inherit; + color: $accent-500; } p { &.lead { + font-weight: 600; font-size: 22px; margin-bottom: 44px; } diff --git a/src/scss/_footer.scss b/src/scss/_footer.scss index 2049d73..63708e9 100644 --- a/src/scss/_footer.scss +++ b/src/scss/_footer.scss @@ -3,15 +3,15 @@ body.rwavw-custom { #footer { // TODO set using theme - how? color: #b0b0b0; - background-color: #272729; + background-color: $neutral-900; a { - color: #fff; + color: $accent-500; font-weight: 600; opacity: 0.8; &.button-social { - color: #fff; + color: $accent-500; &.btn-massive > i { font-size: 24px; } diff --git a/src/scss/_hero.scss b/src/scss/_hero.scss index e706817..c7cc995 100644 --- a/src/scss/_hero.scss +++ b/src/scss/_hero.scss @@ -81,14 +81,30 @@ body.rwavw-custom { border: 3px solid $accent-500; &:first-child { - color: $neutral-900; - background-color: $accent-500; + $bg-color: $accent-500; + margin-bottom: 22px; + padding: 17px 18px; + color: rgba($neutral-900, 0.85); + border: 0; + background-color: $bg-color; + background: linear-gradient( + to top right, + rgba($bg-color, 0.95), + rgba($bg-color, 0.8) + ); } &:last-child { + $bg-color: $neutral-900; + color: $accent-500; - background-color: rgba($neutral-900, 0.2); + background-color: rgba($bg-color, 0.4); + background: linear-gradient( + to top right, + rgba($bg-color, 0.45), + rgba($bg-color, 0.15) + ); } } } @@ -178,6 +194,8 @@ body.rwavw-custom { a { margin: 0 11px; + padding: 14px 18px; + font-size: 20px; &:first-child { margin-bottom: 0; diff --git a/src/scss/_social-proof.scss b/src/scss/_social-proof.scss index d649baf..5a6d1da 100644 --- a/src/scss/_social-proof.scss +++ b/src/scss/_social-proof.scss @@ -18,11 +18,8 @@ body.rwavw-custom { } } - .testimonials-widget-testimonial.list { - } - .bx-wrapper { - height: 270px; + height: 285px; } .testimonials-widget { @@ -46,15 +43,19 @@ body.rwavw-custom { } > blockquote { + font-size: 15px; + border-color: rgba($accent-500, 0.4); } > .credit { + font-weight: 600; + opacity: 0.75; } } @media (min-width: 64em) { .widget.social-proof { - min-height: 296px; + min-height: 315px; } } } diff --git a/src/scss/style.scss b/src/scss/style.scss index d418fa2..5e31a7d 100644 --- a/src/scss/style.scss +++ b/src/scss/style.scss @@ -171,4 +171,53 @@ body.rwavw-custom { font-size: 60px; } } + + .widget.rwavw-cta-box { + .section-cols > .pure-g { + display: flex; + flex-direction: column; + justify-content: center; + align-items: center; + align-content: center; + + > div { + margin: 22px 0; + } + } + + a { + &:link, + &:visited { + color: $accent-500; + font-weight: bold; + font-size: 18px; + opacity: 0.8; + } + + &:hover, + &:active { + opacity: 1; + } + + svg { + position: relative; + width: auto; + height: 29px; + top: 9px; + margin-left: 5px; + } + } + + @media (min-width: 680px) { + .section-cols > .pure-g { + flex-direction: row; + justify-content: space-around; + align-items: flex-start; + + > div { + flex: 0 0 auto; + } + } + } + } }