| .toc { |
| width: 20em; |
| flex-grow: 1; |
| flex-shrink: 0; |
| padding: $m-s; |
| font-size: 1.125em; |
| border-right: 1px solid $medium-purple; |
| border-right: 1px solid var(--text-second); |
| |
| > nav > ul > li > a { |
| text-transform: uppercase; |
| font-size: 1.25em; |
| font-weight: 300; |
| font-family: 'Livvic', sans-serif; |
| margin-top: 1.5em; |
| display: block; |
| } |
| |
| ul { |
| list-style-type: none; |
| padding: 0; |
| margin-bottom: 1.25em; |
| } |
| |
| li { |
| margin-bottom: 0.75em; |
| } |
| |
| > nav > ul { |
| font-weight: bold; |
| } |
| |
| a { |
| color: $dark-purple; |
| color: var(--text-color); |
| display: block; |
| text-decoration: none; |
| line-height: 1.2; |
| text-transform: uppercase; |
| |
| &:hover, |
| &:focus { |
| text-decoration: underline; |
| } |
| |
| &:focus { |
| outline: 1px dashed; |
| outline-offset: 0.3em; |
| } |
| } |
| |
| > nav > ul ul { |
| //font-weight: normal; |
| margin-top: 0.75em; |
| |
| a { |
| text-transform: none; |
| } |
| } |
| |
| > nav > ul ul ul { |
| font-weight: normal; |
| font-size: 0.875em; |
| |
| a { |
| color: $medium-purple; |
| color: var(--text-second); |
| } |
| } |
| } |
