diff options
Diffstat (limited to 'assets/sass/_alavetelicon.scss')
| -rw-r--r-- | assets/sass/_alavetelicon.scss | 64 |
1 files changed, 64 insertions, 0 deletions
diff --git a/assets/sass/_alavetelicon.scss b/assets/sass/_alavetelicon.scss new file mode 100644 index 000000000..0d62b6558 --- /dev/null +++ b/assets/sass/_alavetelicon.scss @@ -0,0 +1,64 @@ +.alavetelicon-banner { + background: #606860 url(../img/instituto-nacional-de-estadistica.jpg) 50% 50% no-repeat; + background-size: cover; + + p, h2 { + margin: 0; + } +} + +.alavetelicon-banner__mask { + background-color: rgba(0,0,0,0.6); + padding: 2em 0; + color: #fff; + text-shadow: 0 1px 2px rgba(0,0,0,0.4); +} + +.alavetelicon-banner__heading { + font-weight: 600; // semibold + font-size: 1.2em; + line-height: 1.4em; +} + +.alavetelicon-banner__button { + display: inline-block; + padding: 0.5em 0.8em; + margin-top: 1em; + line-height: 1em; + color: #fff; + background-color: $colour_brand; + background-color: rgba(0,0,0,0.3); + border: 1px solid #ccc; + border-color: rgba(200,200,200,0.4); + border-radius: 0.3em; + + &:hover, + &:focus { + text-decoration: none; + background: #fff; + color: #000; + border-color: #fff; + text-shadow: none; + } +} + +.alavetelicon-image-attribution { + color: mix(#fff, $colour_black, 50%); + font-size: 0.8em; + margin-bottom: 2em; +} + +@media (min-width: $mediumish-screen) { + .alavetelicon-banner { + p, h2 { + padding-right: 10em; + } + } + + .alavetelicon-banner__button { + position: absolute; + top: 50%; + right: 1em; + margin-top: -1em; + } +}
\ No newline at end of file |