$primary: #17a; body { margin: 0 auto; padding: 0; font-family: sans-serif; font-size: 1.2em; max-width:1000px; } #header a, #menu a, #nav a { text-decoration: none; } #header { padding: .5em; font-size: 1.5em; a { color: $primary; } .subtitle { font-size: .7em; color: #444; } } #menu ul, #nav ul { margin: 0; padding: 0; list-style-type: none; overflow: hidden; } #menu { background-color: $primary; ul li { float: left; &.active a { font-weight: bold; } a { display: block; padding: .5em; color: #fff; &:hover { background-color: darken($primary,6); } } } } #nav { float: left; height: 100%; border-right: 1px dotted #ccc; padding: 1em 0; width: 200px; box-sizing: border-box; ul li a { display: block; padding: .5em; color: #000; &:hover { background-color: #ddd; } } } #main { padding: 1.5em; margin-left: 200px; .title { font-size: 1.2em; font-weight: bold; margin: 1em 0 .2em 0; } .metadata { text-align: right; } video { width: 100%; } } @import "_media.scss";