diff --git a/src/images/contact-us/facebook.svg b/src/images/contact-us/facebook.svg new file mode 100644 index 000000000..a148dbac3 --- /dev/null +++ b/src/images/contact-us/facebook.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/images/contact-us/instagram.svg b/src/images/contact-us/instagram.svg new file mode 100644 index 000000000..769fcd576 --- /dev/null +++ b/src/images/contact-us/instagram.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/images/contact-us/twitter.svg b/src/images/contact-us/twitter.svg new file mode 100644 index 000000000..baee0f5fa --- /dev/null +++ b/src/images/contact-us/twitter.svg @@ -0,0 +1,3 @@ + + + diff --git a/src/index.html b/src/index.html index ca8008a77..345effb71 100644 --- a/src/index.html +++ b/src/index.html @@ -104,7 +104,7 @@

We believe in the power of bold ideas that
-

Intro


+

Intro

By the same illusion which lifts the
horizon.

@@ -388,30 +388,61 @@

diff --git a/src/styles/blocks/footer.scss b/src/styles/blocks/footer.scss index a1a0bbcf0..673e6e0e8 100644 --- a/src/styles/blocks/footer.scss +++ b/src/styles/blocks/footer.scss @@ -15,9 +15,12 @@ &__message{ display: flex; flex-direction: column; - grid-column: 1 /-1; + @include on-small-desktop{ + grid-column: 1 / 6; + } + & button{ @extend %button; @@ -64,7 +67,13 @@ &__contact{ grid-column: 1 / -1; + @include on-small-desktop{ + grid-column: 7 / 12; + } + @include on-large-desktop{ + grid-column: 8 / 13; + } &-title{ font-size: 32px; @@ -93,12 +102,25 @@ margin-bottom: 40px; } + & a{ + text-decoration: none; + color: inherit; + } + & a:hover{ + color: #144ED4; + } + &-image{ object-fit: contain; object-position: center; width: 32px; height: 32px; margin-right: 32px; + fill: #fff; + + &:hover path{ + fill: #144ED4; + } } } } @@ -137,7 +159,6 @@ @include on-tablet{ flex-direction: row; - & :not(:last-child){ margin-right: 64px; } diff --git a/src/styles/blocks/header.scss b/src/styles/blocks/header.scss index 0331deae2..a721b5321 100644 --- a/src/styles/blocks/header.scss +++ b/src/styles/blocks/header.scss @@ -1,5 +1,4 @@ .header { - // display: none !important; width: 100%; height: 893px; background-color: $bg-header; @@ -79,6 +78,8 @@ flex-direction: row; } + + &--text{ color: #fff; margin-top: 16px; @@ -91,13 +92,23 @@ margin-left: 24px; } - & span{ - font-family: poppins, Arial, Helvetica, sans-serif; + & h3{ + display: block; font-size: 13px; line-height: 150%; - letter-spacing: 3px; font-weight: 700; + font-family: poppins, Arial, Helvetica, sans-serif; + letter-spacing: 3px; text-transform: uppercase; + margin: 0 0 8px; + + } + + & p{ + font-family: "open sans", Arial, Helvetica, sans-serif; + font-size: 14px; + line-height: 150%; + font-weight: 400; } } diff --git a/src/styles/page.scss b/src/styles/page.scss index 1afc8ae00..13bdf45ac 100644 --- a/src/styles/page.scss +++ b/src/styles/page.scss @@ -8,3 +8,7 @@ body { background: $c-gray; margin: 0; } + +button{ + cursor: pointer; +} diff --git a/src/styles/utils/_extends.scss b/src/styles/utils/_extends.scss index 9710bb61e..89d754176 100644 --- a/src/styles/utils/_extends.scss +++ b/src/styles/utils/_extends.scss @@ -10,4 +10,8 @@ background-color: #2060F6; color: #fff; border: 0; + font-size: 15px; + line-height: 150%; + font-weight: 600; + font-family: poppins, Arial, Helvetica, sans-serif; }