html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } body { line-height: 1; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } table { border-collapse: collapse; border-spacing: 0; } .about { margin: 70px auto 40px; padding: 8px; width: 260px; font: 10px/18px 'Lucida Grande', Arial, sans-serif; color: #bbb; text-align: center; text-shadow: 0 -1px rgba(0, 0, 0, 0.3); background: #383838; background: rgba(34, 34, 34, 0.8); border-radius: 4px; background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3)); background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3)); background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3)); background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.3)); -webkit-box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 0 6px rgba(0, 0, 0, 0.4); box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.2), 0 0 6px rgba(0, 0, 0, 0.4); } .about a { color: #eee; text-decoration: none; border-radius: 2px; -webkit-transition: background 0.1s; -moz-transition: background 0.1s; -o-transition: background 0.1s; transition: background 0.1s; } .about a:hover { text-decoration: none; background: #555; background: rgba(255, 255, 255, 0.15); } .about-links { height: 30px; } .about-links > a { float: left; width: 50%; line-height: 30px; font-size: 12px; } .about-author { margin-top: 5px; } .about-author > a { padding: 1px 3px; margin: 0 -1px; } /* * Copyright (c) 2012-2013 Thibaut Courouble * http://www.cssflow.com * * Licensed under the MIT License: * http://www.opensource.org/licenses/mit-license.php */ body { font: 13px/20px 'Lucida Grande', Tahoma, Verdana, sans-serif; color: #404040; background: #ecedef; } header { padding-top: 60px; background: #404040 url("../img/bg.png") 0 0 repeat; border-bottom: 1px solid #dadada; -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.04); box-shadow: 0 0 1px rgba(0, 0, 0, 0.04); } nav { height: 34px; border-bottom: 5px solid white; -webkit-box-shadow: inset 0 -2px 1px rgba(0, 0, 0, 0.03); box-shadow: inset 0 -2px 1px rgba(0, 0, 0, 0.03); } .nav { margin: 0 auto; width: 680px; } .nav a { display: block; text-decoration: none; } .nav > li { float: left; margin-right: 3px; } .nav > li > a { height: 34px; line-height: 34px; padding: 0 20px; font-weight: bold; color: white; text-decoration: none; text-shadow: 0 -1px rgba(0, 0, 0, 0.3); background: #759aaf; border-radius: 3px 3px 0 0; background-image: -webkit-linear-gradient(top, #9cb6c5, #759aaf); background-image: -moz-linear-gradient(top, #9cb6c5, #759aaf); background-image: -o-linear-gradient(top, #9cb6c5, #759aaf); background-image: linear-gradient(to bottom, #9cb6c5, #759aaf); -webkit-box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 -2px 2px rgba(0, 0, 0, 0.03), 0 2px white, 0 0 2px rgba(0, 0, 0, 0.2); box-shadow: inset 0 1px rgba(255, 255, 255, 0.3), inset 0 -2px 2px rgba(0, 0, 0, 0.03), 0 2px white, 0 0 2px rgba(0, 0, 0, 0.2); } .nav > li > a:hover { text-decoration: none; background: #85a6b8; background-image: -webkit-linear-gradient(top, #afc5d1, #85a6b8); background-image: -moz-linear-gradient(top, #afc5d1, #85a6b8); background-image: -o-linear-gradient(top, #afc5d1, #85a6b8); background-image: linear-gradient(to bottom, #afc5d1, #85a6b8); } .nav > li.active > a, .nav > li > a:active, .nav > .dropdown:hover > a { background: white; color: #404040; text-shadow: none; -webkit-box-shadow: 0 2px white, 0 0 2px rgba(0, 0, 0, 0.2); box-shadow: 0 2px white, 0 0 2px rgba(0, 0, 0, 0.2); } .nav a.icon { position: relative; width: 40.8px; padding: 0; } .nav a.icon > span { display: block; position: absolute; top: 9px; left: 12px; height: 16px; width: 16px; background-repeat: no-repeat; background-position: 0 0; font: 0/0 serif; text-shadow: none; color: transparent; } .nav a.icon.home > span { background-image: url("../img/home.png"); } .nav .active a.icon > span, .nav a.icon:active > span { background-position: 0 -16px; } .dropdown { position: relative; border-bottom: 5px solid white; } .dropdown:hover ul { display: block; } .dropdown ul { display: none; position: absolute; top: 39px; left: -1px; min-width: 160px; padding: 0 0 5px; background: white; border: 1px solid #dadada; border-top: 0; border-radius: 0 0 3px 3px; -webkit-box-shadow: 0 0 1px rgba(0, 0, 0, 0.04); box-shadow: 0 0 1px rgba(0, 0, 0, 0.04); } .dropdown ul.large { min-width: 200px; } .dropdown li { display: block; margin: 0 18px; overflow: visible; } .dropdown li + li { border-top: 1px solid #eee; } .dropdown li a { color: #555; padding: 8px 18px; margin: 0 -18px; } .dropdown li a:hover { color: black; }