.menu {
background: $main-color; color: $link-color;
}
.header {
text-align: center; top: auto; margin: 3em auto; &__title { @include header-font; font-size: 2.35em; line-height: 1em; font-weight: bold; margin: 0; text-transform: uppercase; } &__title_link { color: $link-color; text-decoration: none; &:hover, &:focus { text-decoration: none; color: $grey-color; } } &__tagline { @include header-font; margin: 0; font-size: 1.5em; font-weight: 200; margin-top: 0.25em; color: $text-color; white-space: nowrap; } &__subscribe_link { background: rgba(0,0,0,0); border: 2px solid #fff; font-variant: small-caps; color: #fff; border-radius: 25px; margin-top: 36px; &:hover, &:focus { text-decoration: none; color: $header-color; border-color: $header-color; } }
}
.nav_list {
margin: 1em 0 0; padding: 0; list-style: none; &__item { @include header-font; display: inline-block; *display: inline; zoom: 1; } &__item_link { background: transparent; border: 2px solid $link-color; color: $link-color; margin-top: 0.35em; letter-spacing: 0.05em; text-transform: uppercase; font-size: 85%; &:hover, &:focus { border: 2px solid $grey-color; color: $grey-color; text-decoration: none; } }
}
@media (min-width: $mobile) {
.menu { position: fixed; top: 0; bottom: 0; } .header { margin: 4.25rem 1.75rem 0; text-align: right; }
}