117 lines
No EOL
2.1 KiB
Sass
117 lines
No EOL
2.1 KiB
Sass
$footer-shade-1: #2E2A51
|
|
$footer-shade-2: #1F1C3F
|
|
$footer-shade-3: #12102E
|
|
|
|
|
|
#footer
|
|
position: relative
|
|
|
|
|
|
@include diagonal(-4deg, $footer-shade-2, 130px, after)
|
|
bottom: 120px
|
|
left: 0
|
|
|
|
.credits
|
|
text-align: center
|
|
position: relative
|
|
background-color: $footer-shade-3
|
|
color: $portage
|
|
z-index: 99
|
|
line-height: 40px
|
|
@include diagonal(-2deg, $footer-shade-3, 80px, before)
|
|
top: -40px
|
|
left: 0
|
|
|
|
@media (max-width: $screen-md)
|
|
margin-top: 40px
|
|
|
|
h4
|
|
line-height: 40px
|
|
border-bottom: solid 1px rgba($portage,.5)
|
|
|
|
.footer-nav
|
|
li
|
|
line-height: 1.7em
|
|
a
|
|
color: $portage
|
|
font-size: .9em
|
|
&:hover
|
|
color: $algolia-blue
|
|
text-decoration: none
|
|
|
|
.network-links
|
|
margin: 0
|
|
padding: 0
|
|
li
|
|
display: inline-block
|
|
padding: 0
|
|
margin: 0
|
|
text-align: center
|
|
margin: .5em .2em .5em 0
|
|
.btn
|
|
color: $portage
|
|
width: 38px
|
|
line-height: 40px
|
|
max-height: 38px
|
|
font-size: 24px
|
|
padding: 0
|
|
border: solid 1px rgba($portage,.4)
|
|
&:hover
|
|
color: white
|
|
|
|
.newsletter-signup
|
|
position: relative
|
|
|
|
.mc-signupmessage
|
|
width: 100%
|
|
height: 100%
|
|
background-color: $white
|
|
position: absolute
|
|
z-index: 1
|
|
display: none
|
|
pointer-events: none
|
|
opacity: 0
|
|
transition: 400ms ease-in-out
|
|
|
|
svg
|
|
width: 15px
|
|
margin-left: 4px
|
|
vertical-align: middle
|
|
|
|
.form-control
|
|
border-radius: 20px
|
|
line-height: 40px
|
|
padding: 0 16px
|
|
height: 40px
|
|
border: none
|
|
width: 230px
|
|
|
|
@media (max-width: $screen-md)
|
|
width: 180px !important
|
|
|
|
&--success
|
|
.mc-signupmessage
|
|
animation: fadeIn 200ms ease-in-out forwards
|
|
display: block
|
|
|
|
@keyframes fadeIn
|
|
from
|
|
opacity: 0
|
|
to
|
|
opacity: 1
|
|
|
|
.search-icon,
|
|
.arrow-icon
|
|
margin-left: 1em
|
|
width: 22px
|
|
height: 42px
|
|
vertical-align: middle
|
|
|
|
@media (max-width: $screen-sm)
|
|
display: none
|
|
|
|
|
|
.arrow-icon
|
|
width: 16px
|
|
use
|
|
fill: $bunting |