/* Fixed-width hints */ #header, #flash { max-width: 990px; } #title { max-width: 975px; } #content { max-width: 960px; } #header, #title, #content, #footer, #flash { margin: 0 auto; } /* end fixed-width hints */ body { margin: 0; font-size: 13px; background: #111; color: #222; } body, input, select, button { font-family: "Brighter Planet", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", sans-serif; } h1, h2, h3, h4, h5, h6, p, ol, ul, li, dl, dt, dd { margin: 0; padding: 0; } pre, kbd { font-family: "DejaVu Mono", monospace; } pre { display: block; line-height: 1.4; overflow: auto; background: white; padding: 10px; margin: 10px -15px; border-top: 1px solid #ddd; -moz-box-shadow: inset 0 5px 5px #eee; } a { outline: none; } a img { border: none; } .sub { font-size: smaller; } #header { background: #111; background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(100,100,100)), color-stop(0.16, rgb(77,77,77)), color-stop(0.75, rgb(48,48,48)), color-stop(1, rgb(28,28,28)) ); background-image: -moz-linear-gradient( center top, rgb(100,100,100) 0%, rgb(77,77,77) 16%, rgb(48,48,48) 75%, rgb(28,28,28) 100% ); overflow: auto; } #header h1 { display: none; } #header ul { list-style: none; overflow: auto; margin: 0 0 0 165px; } #header ul li { border-left: 1px solid black; float: left; width: 120px; } #header ul li.home { width: 164px; } #header ul li a { border-left: 1px solid #555; display: block; text-align: center; text-transform: uppercase; text-decoration: none; color: silver; font-size: 13px; line-height: 1; text-shadow: -1px -1px 0px black; padding: 23.5px 0; } #header ul li div { display: none; background: #222; background: rgba(0,0,0,0.9); min-width: 160px; position: absolute; top: 60px; z-index: 100; -moz-border-radius: 0 0 5px 5px; -webkit-border-radius: 0 0 5px 5px; border-radius: 0 0 5px 5px; border-bottom: 1px solid black; padding: 7px 10px; } @media screen and (-webkit-min-device-pixel-ratio:0) { #header ul li div { top: 59px; }} #header ul li:hover div { display: block; } #header ul li.home a { background: url(images/logo.png) no-repeat 13px 50%; text-indent: -150px; text-align: left; } #header li:last-child { border-right: 1px solid #555; } #header li:last-child a { border-right: 1px solid black; } #header ul li a:hover { background-color: rgba(0,0,0,0.1); } #header ul li div ul { margin: 0; width: auto; } #header ul li div ul li { float: none; width: auto; border: none; } #header ul li div ul li:last-child { border: none; } #header ul li div ul li a { border: none; text-align: left; text-transform: none; text-decoration: underline; color: #aaa; line-height: 1.2; text-shadow: 1px 1px 0 black; padding: 3px 0; font-size: 14px; } #header ul li div ul li a:hover { background: none; color: #ddd; } #header p { position: absolute; right: 15px; top: 0; width: 200px; line-height: 58px; color: #aaa; text-align: right; } #header p a { color: inherit; font-size: 12px; text-shadow: -1px -1px 0 black; } #header p a:hover { color: silver; } /* full-width #header fixes */ #header { max-width: none; } #header ul { margin: 0 auto; width: 994px; } #header p { left: 50%; right: auto; width: 285px; padding: 0 10px 0 0; z-index: 0; margin: 0 0 0 200px; } /* end full-width #header fixed */ #nav { background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(0,79,140)), color-stop(1, rgb(0,39,69)) ); background-image: -moz-linear-gradient( center top, rgb(0,79,140) 0%, rgb(0,39,69) 100% ); overflow: auto; font-size: 11px; } #nav h3 { float: left; width: 150px; text-align: right; color: silver; text-shadow: -1px -1px 0px black; padding: 1px 0 0; font-size: 12px; visibility: hidden; } #nav h3:after { content: " →"; } #nav ul { list-style: none; overflow: auto; margin: 0 0 0 165px; } #nav ul li { border-left: 1px solid black; float: left; width: 100px; } #nav ul li a { border-left: 1px solid #555; display: block; text-align: center; text-transform: uppercase; text-decoration: none; color: silver; line-height: 1; text-shadow: -1px -1px 0px black; padding: 5px 0; } #nav li:last-child { border-right: 1px solid #555; } #nav li:last-child a { border-right: 1px solid black; } #nav ul li a:hover { background: rgba(0,0,0,0.1); } #main { background: #f1f1f1; } #title { background-color: #5FBBFF; background-repeat: no-repeat; background-position: 20px 20%; padding: 20px 0 0 15px; height: 70px; border-bottom: 1px solid #0070C4; -moz-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1); -webkit-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1); box-shadow: inset 0 10px 10px rgba(0,0,0,0.1); } #title h1, #title h2 { font-size: 18px; text-shadow: 1px 1px 0px rgba(255,255,255,0.5); margin: 0; } #title h1 a { color: blue; } #title h2 a { color: inherit; } #title h2 { color: #333; } #content, #flash { background: #f1f1f1; } #flash { padding: 0 0 15px; } #content { padding: 15px 15px 50px; position: relative; overflow: auto; } #content>p { margin: 0 0 10px; } #content h1 { font-size: 18px; margin: 0 0 20px; text-shadow: 1px 1px 0 white; color: #333; } #content h2 { font-size: 18px; margin: 25px 0 20px; text-shadow: 1px 1px 0 white; color: gray; } #content h3 { margin: 30px 0 0; } #content>ul { list-style: square; margin: 10px 0 10px; padding: 0 0 0 1em } #content p.cta { border: 1px solid #5FBBFF; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; overflow: auto; } p.cta a { display: block; padding: 10px; color: blue; } #content form dl dt { float: left; width: 140px; text-align: right; margin: 0 10px 0 0; padding: 10px 0 0; } #content form dl dt .field_with_errors label, #content form dl dt.label .field_with_errors { color: #F16262; } #content form dl dt label, #content form dl dt.label { color: #444; text-shadow: 1px 1px 0 white; } #content form dl dd { margin: 0 15px 10px 150px; position: relative; } #content form dl dd input[type=text], #content form dl dd input[type=password] { font-size: 21px; padding: 4px; width: 100%; max-width: 600px; } #content form dl dd select { font-size: 21px; } #content form p.action { margin: 20px 0 0 150px; } #content form p.action input[type=submit], #content form p.action button { background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(100,100,100)), color-stop(0.16, rgb(77,77,77)), color-stop(0.75, rgb(48,48,48)), color-stop(1, rgb(28,28,28)) ); background-image: -moz-linear-gradient( center top, rgb(100,100,100) 0%, rgb(77,77,77) 16%, rgb(48,48,48) 75%, rgb(28,28,28) 100% ); -moz-border-radius: 3px; -webkit-border-radius: 3px; border: none; border-radius: 3px; padding: 5px; color: #ddd; text-decoration: none; text-shadow: -1px -1px 0 black; text-align: center; font-size: 18px; } p.new, div.destroy { margin: 15px 15px 0 150px; } p.new a { color: blue; text-decoration: none; text-transform: uppercase; text-shadow: 1px 1px 0 white; } p.new a:before { content: "✚"; font-size: 30px; margin: 0 5px 0 0; vertical-align: -3px; } p.new a:hover:before { color: #333; } div.destroy input[type=submit] { background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(255,66,66)), color-stop(0.15, rgb(245,19,19)), color-stop(0.75, rgb(204,10,10)), color-stop(1, rgb(143,6,6)) ); background-image: -moz-linear-gradient( center top, rgb(255,66,66) 0%, rgb(245,19,19) 15%, rgb(204,10,10) 75%, rgb(143,6,6) 100% ); -moz-border-radius: 3px; -webkit-border-radius: 3px; border: none; border-radius: 3px; padding: 5px; color: #ddd; text-decoration: none; text-shadow: -1px -1px 0 black; text-align: center; } #content>p.back { margin: 10px 15px 10px 150px; border-top: 1px solid silver; padding: 10px 0 0; } p.back:before { content: "← " } p.back a { color: blue; } p.flash { margin: 0 15px 0 165px; padding: 10px; position: relative; color: white; font-size: 15px; } p.flash.error { background: #F16262; border-left: 1px solid #C11A1A; border-bottom: 1px solid #C11A1A; border-right: 1px solid #C11A1A; text-shadow: -1px -1px 0 #C11A1A; } p.flash.notice { background: silver; border-left: 1px solid gray; border-bottom: 1px solid gray; border-right: 1px solid gray; text-shadow: -1px -1px 0 gray; } p.flash:before { position: absolute; left: -35px; top: -7px; line-height: 45px; font-size: 40px; text-shadow: 1px 1px 0 silver; } p.flash.error:before { content: "⚠"; color: #F16262; } #footer #divider { background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(77,77,77)), color-stop(1, rgb(48,48,48)) ); background-image: -moz-linear-gradient( center top, rgb(77,77,77) 0%, rgb(48,48,48) 100% ); overflow: auto; font-size: 11px; min-height: 15px; clear: both; } #footer #map { -moz-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1); -webkit-box-shadow: inset 0 10px 10px rgba(0,0,0,0.1); box-shadow: inset 0 10px 10px rgba(0,0,0,0.1); text-shadow: 1px 1px 0 black; overflow: auto; padding: 0 0 45px 0; width: 990px; margin: 0 auto; } #footer #map #slogan { margin: 25px 15px 0 13px; width: 135px; float: left; } #footer #map #slogan h1 { font-size: 16px; color: #2DB56A; font-weight: normal; } #footer #map #slogan p.slogan { color: silver; } #footer #map p.description, #footer #map #links p { font-size: 11px; color: gray; margin: 5px 0 0; } #footer #links { margin: 25px 0 0; } #footer #map #links p { font-size: 14px; } #footer #map #links p a { color: inherit; } #footer #map #social { float: right; list-style: none; margin: 25px 0 0 20px; } #footer #map #social li { width: 40px; float: right; margin: 0 0 0 6px; } #footer #map #social li a { display: block; background: #222; -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(100,100,100)), color-stop(0.16, rgb(77,77,77)), color-stop(0.75, rgb(48,48,48)), color-stop(1, rgb(28,28,28)) ); background-image: -moz-linear-gradient( center top, rgb(100,100,100) 0%, rgb(77,77,77) 16%, rgb(48,48,48) 75%, rgb(28,28,28) 100% ); overflow: auto; color: #aaa; text-shadow: 0 -1px 0 #000; font-size: 32px; line-height: 40px; text-align: center; text-decoration: none; font-family: "Social Media Vectors"; } #footer #map #social li a:hover { color: #ccc; } ul.pages { background: #F1F1F1; padding: 15px 15px 10px 165px; list-style: none; overflow: auto; } ul.pages li { float: left; margin: 0 5px 0 0; } ul.pages li:first-child { margin-left: -6px; } ul.pages li.current { background: white; -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; font-weight: bold; -moz-box-shadow: -1px -1px 0 silver; -webkit-box-shadow: -1px -1px 0 silver; box-shadow: -1px -1px 0 silver; } ul.pages li.current:first-child { margin-left: 0; } ul.pages li.current, ul.pages li a { line-height: 24px; padding: 0 6px; } ul.pages li a { display: block; color: blue; } ul.pages li a:hover { background-image: -webkit-gradient( linear, left top, left bottom, color-stop(0, rgb(230,230,230)), color-stop(1, rgb(200,200,200)) ); background-image: -moz-linear-gradient( center top, rgb(230,230,230) 0%, rgb(200,200,200) 100% ); -moz-border-radius: 3px; -webkit-border-radius: 3px; border-radius: 3px; } .tronprint-footprint { margin-top: 15px !important; font-size: 12px !important; color: #555 !important; }