@font-face { font-family: "CyrBit"; src: url("/static/css/CyrBit.ttf"); } body { display: flex; flex-wrap: wrap; background-color: #232323; color: #aaa; font-family: "CyrBit"; font-size: 20pt; } a { color: #aaa; text-decoration: none; } header#header { width:100%; display: inline-block; } #menu { display: inline-block; flex: 1 10em; } #menu ul { list-style-type: none; padding: 0; border: 1px solid gray; border-radius: 0.5em; } #menu ul li { border-bottom: 1px solid gray; padding: 0.5em 1em; } #libreto { border: 1px solid #aaa; border-radius: 0.5em; text-align: center; } #libreto img { width: 200px; margin-left: auto; margin-right: auto; display: block; } #content { display: inline-block; margin-left: 1em; flex: 10; } .videos { display: flex; flex-wrap: wrap; } .videos figure { flex: 1; border: 1px solid gray; text-align: center; padding: 0.5em; border-radius: 0.5em; } .videos figure legend { font-weight: bold; } video { width: 100%; }