body { background: url(./img/background001.jpg) fixed bottom no-repeat; background-size: cover; color: #51384a; } h1 { clear: both; text-align: center; text-shadow: -1.5px 0 black, 0 1.5px black, 1.5px 0 black, 0 -1.5px black; font-size: 2em; color: #e5cbf5; width: 100%; font-weight: 600; } article, #options-panel { background: rgba(229, 203, 245, 0.7) url('./img/weeee.gif') no-repeat scroll bottom right; background-size: 70px; } section { background: rgba(72, 34, 102, 0.5); padding: 10px; transform: rotate(5deg) skew(5deg); transition: ease-in 0.5s; } section > figure, section > header, section > blockquote, section > .omit { color: #fff; } a, .embed, .embed:hover { color: #ff69b4; } .pagination, .act { background-color: #e5cbf5; color: #51384a; } #sync, #feedback, #options, #bottom > a { color: #ff69b4; background-color: #e5cbf5; padding: 2px } #lock { color: #ff96b4 } section > header > b { color: #FF6600; animation: hue 3s infinite; } header > .act, #bottom { background: none; } header > nav a, preview > nav a { color: #51384a; } section > header > nav a { color: #fff; } h3 { color: yellow; } .editing { animation: hue 5s alternate infinite; } .preview { background-color: rgba(229, 203, 245, 0.9); } article a, preview a { color: #330066; } @keyframes hue { 0% { filter: hue-rotate(0deg) saturate(100%); } 25% { filter: hue-rotate(45deg) saturate(500%); } 50% { filter: hue-rotate(90deg) saturate(100%); } 75% { filter: hue-rotate(135deg) saturate(500%); } 100%{ filter: hue-rotate(180deg) saturate(100%); } }