/*
  reset.css contains both a reset and some base styles.
*/

/*
martes@ebrosllc.com
verbatim from http://html5readiness.com


html5doctor.com Reset Stylesheet
v1.6.1
Last Updated: 2010-09-17
Author: Richard Clark - http://richclarkdesign.com
Twitter: @rich_clark
*/

html, body, div, span, iframe,
h1, h2, h3, p,
em, img,
small,
b, i,
dl, dt, dd, ol, ul, li,
label,
aside,
footer, header, nav, section {
    margin:0;
    padding:0;
    border:0;
    outline:0;
    font-size:100%;
    vertical-align:baseline;
    background:transparent;
}

body { line-height:1; }

article,aside,
footer,header,nav,section { display:block; }

a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }

input, select { vertical-align:middle; }

/*
fonts.css from the YUI Library: http://developer.yahoo.com/yui/
refer to http://developer.yahoo.com/yui/fonts/ for font sizing
*/
body { font:13px arial,helvetica,clean,sans-serif; *font-size:small; *font:x-small; }

select, input, textarea { font:99% arial,helvetica,clean,sans-serif; }

body * { line-height:1.22em; }

/* always force a scrollbar in non-IE */
html { overflow-y: scroll; }

/* styling the basics.
   original author: paul irish
   TODO: consider: http://developer.yahoo.com/yui/base/ */

body, select, input, textarea { color:#444; /* looks better than black: http://twitter.com/H_FJ/statuses/11800719859 */ }

strong, th, h1,h2,h3 { font-weight: bold; }

h3 { font-size:107%; margin:13px 0 3px; }
h2 { font-size:122%; margin:15px 0 3px; }
h1 { font-size:136%; margin:0 0 10px; }

p { margin:15px 0 10px; }

a, a:active { color:#607890; }
a:visited  { color:#607890; }
a:hover { color:#036; }

ul { margin-left:30px; }

small { font-size:85%; }

.css-chart p a:focus,
.css-chart p a:active { outline: 0;}

html { background: #78909c; }

body { background: #78909c; background-image: -webkit-linear-gradient(#51545b, #78909c); background-image: linear-gradient(#51545b, #78909c); color: #f2efde; font-family: "Gill Sans", Calibri, "DejaVu Sans", sans-serif; }

a, a:visited, a:active { text-decoration: none; color: black; font-weight: bold; font-size: 1em; -webkit-transition: color 0.2s linear; transition: color 0.2s linear; }

a:hover, a.selected { color: #fbe762; }

div.css-chart { background-image: -webkit-radial-gradient(482px 519px, circle, rgba(90, 100, 112, 0.5) 250px, rgba(0, 0, 0, 0) 400px); background-image: radial-gradient(circle at 482px 519px, rgba(90, 100, 112, 0.5) 250px, rgba(0, 0, 0, 0) 400px); margin: 0 auto 0 auto; width: 964px; height: 530px; position: relative; }
div.css-chart p { display: block; position: absolute; bottom: -10px; left: 482px; background: rgba(74, 65, 70, 0.1); width: 282px; height: 22px; border: 0; padding: 0 0 0 200px; -webkit-transition: background 0.2s ease-out; transition: background 0.2s ease-out; }
div.css-chart p:hover { background: #4a4146; }
div.css-chart p.css3 { background: rgba(74, 65, 70, 0.1); }
div.css-chart p.css3:hover { background: rgba(190, 211, 100, 0.2); }
div.css-chart p em { position: absolute; bottom: 0; left: 0; width: 100%; height: 22px; }
div.css-chart p em b { opacity: 0; -webkit-transition: opacity 1s ease-in; transition: opacity 1s ease-in; }
.twenty13 div.css-chart p em.twenty13 b, .twenty12 div.css-chart p em.twenty12 b, .twenty11 div.css-chart p em.twenty11 b, .twenty10 div.css-chart p em.twenty10 b, .twenty09 div.css-chart p em.twenty09 b, .twenty08 div.css-chart p em.twenty08 b { opacity: 1; }
div.css-chart p a { display: block; width: 100%; height: 100%; font-weight: normal; -webkit-transition: none; transition: none; position: relative; }
div.css-chart p i { opacity: 0; position: absolute; top: 0; right: 284px; width: 400px; z-index: 4; display: block; height: auto; color: #f2efde; padding: 10px; text-align: center; border-radius: 0.5em; text-shadow: 1px 1px 0 black, 2px 2px 0 black, 3px 3px 0 black, 4px 4px 0 black, 5px 5px 0px black; -webkit-transition: opacity 0.2s ease-in; transition: opacity 0.2s ease-in; text-transform: uppercase; font-size: 28px; }
div.css-chart p:hover i { opacity: 1; }
div.css-chart p b { width: 12.5%; display: block; height: 22px; float: left; }

b.ie6 { background-color: rgba(218, 168, 192, 0.6); }
b.ie7 { background-color: rgba(222, 146, 159, 0.6); }
b.ie8 { background-color: rgba(131, 72, 92, 0.6); }
b.ie9 { background-color: rgba(233, 83, 120, 0.6); }
b.ie10 { background-color: rgba(255, 96, 150, 0.6); }
b.ff20 { background-color: rgba(66, 147, 194, 0.6); }
b.ff30 { background-color: rgba(74, 188, 241, 0.6); }
b.ff35 { background-color: rgba(59, 144, 175, 0.6); }
b.ff36 { background-color: rgba(69, 167, 203, 0.6); }
b.ff { background-color: rgba(69, 189, 222, 0.6); }
b.op95 { background-color: rgba(161, 45, 13, 0.6); }
b.op96 { background-color: rgba(197, 46, 16, 0.6); }
b.op { background-color: rgba(226, 79, 45, 0.6); }
b.ch2 { background-color: rgba(207, 133, 27, 0.6); }
b.ch { background-color: rgba(245, 155, 58, 0.6); }
b.sa31 { background-color: rgba(190, 183, 64, 0.6); }
b.sa32 { background-color: rgba(216, 184, 73, 0.6); }
b.sa { background-color: rgba(251, 231, 98, 0.6); }

ul { position: fixed; top: 40px; left: 40px; width: 108px; }
ul li li { opacity: 0; -webkit-transition: opacity 1s ease-in; transition: opacity 1s ease-in; }
ul li { list-style: none; padding: 0 0 0.5em 0; width: 200px; float: left; text-transform: uppercase; }
.twenty13 ul .twenty13 li, .twenty12 ul .twenty12 li, .twenty11 ul .twenty11 li, .twenty10 ul .twenty10 li, .twenty09 ul .twenty09 li, .twenty08 ul .twenty08 li { opacity: 1; }

li b { display: inline-block; width: 20px; height: 20px; border-radius: 20em; }

#ray-1 { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-1 i { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-2 { -webkit-transform: rotate(-6.42857deg); -ms-transform: rotate(-6.42857deg); transform: rotate(-6.42857deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-2 i { -webkit-transform: rotate(6.42857deg); -ms-transform: rotate(6.42857deg); transform: rotate(6.42857deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-3 { -webkit-transform: rotate(-12.85714deg); -ms-transform: rotate(-12.85714deg); transform: rotate(-12.85714deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-3 i { -webkit-transform: rotate(12.85714deg); -ms-transform: rotate(12.85714deg); transform: rotate(12.85714deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-4 { -webkit-transform: rotate(-19.28571deg); -ms-transform: rotate(-19.28571deg); transform: rotate(-19.28571deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-4 i { -webkit-transform: rotate(19.28571deg); -ms-transform: rotate(19.28571deg); transform: rotate(19.28571deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-5 { -webkit-transform: rotate(-25.71429deg); -ms-transform: rotate(-25.71429deg); transform: rotate(-25.71429deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-5 i { -webkit-transform: rotate(25.71429deg); -ms-transform: rotate(25.71429deg); transform: rotate(25.71429deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-6 { -webkit-transform: rotate(-32.14286deg); -ms-transform: rotate(-32.14286deg); transform: rotate(-32.14286deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-6 i { -webkit-transform: rotate(32.14286deg); -ms-transform: rotate(32.14286deg); transform: rotate(32.14286deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-7 { -webkit-transform: rotate(-38.57143deg); -ms-transform: rotate(-38.57143deg); transform: rotate(-38.57143deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-7 i { -webkit-transform: rotate(38.57143deg); -ms-transform: rotate(38.57143deg); transform: rotate(38.57143deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-8 { -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-8 i { -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-9 { -webkit-transform: rotate(-51.42857deg); -ms-transform: rotate(-51.42857deg); transform: rotate(-51.42857deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-9 i { -webkit-transform: rotate(51.42857deg); -ms-transform: rotate(51.42857deg); transform: rotate(51.42857deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-10 { -webkit-transform: rotate(-57.85714deg); -ms-transform: rotate(-57.85714deg); transform: rotate(-57.85714deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-10 i { -webkit-transform: rotate(57.85714deg); -ms-transform: rotate(57.85714deg); transform: rotate(57.85714deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-11 { -webkit-transform: rotate(-64.28571deg); -ms-transform: rotate(-64.28571deg); transform: rotate(-64.28571deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-11 i { -webkit-transform: rotate(64.28571deg); -ms-transform: rotate(64.28571deg); transform: rotate(64.28571deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-12 { -webkit-transform: rotate(-70.71429deg); -ms-transform: rotate(-70.71429deg); transform: rotate(-70.71429deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-12 i { -webkit-transform: rotate(70.71429deg); -ms-transform: rotate(70.71429deg); transform: rotate(70.71429deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-13 { -webkit-transform: rotate(-77.14286deg); -ms-transform: rotate(-77.14286deg); transform: rotate(-77.14286deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-13 i { -webkit-transform: rotate(77.14286deg); -ms-transform: rotate(77.14286deg); transform: rotate(77.14286deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-14 { -webkit-transform: rotate(-83.57143deg); -ms-transform: rotate(-83.57143deg); transform: rotate(-83.57143deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-14 i { -webkit-transform: rotate(83.57143deg); -ms-transform: rotate(83.57143deg); transform: rotate(83.57143deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-15 { -webkit-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-15 i { -webkit-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-16 { -webkit-transform: rotate(-96.42857deg); -ms-transform: rotate(-96.42857deg); transform: rotate(-96.42857deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-16 i { -webkit-transform: rotate(96.42857deg); -ms-transform: rotate(96.42857deg); transform: rotate(96.42857deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-17 { -webkit-transform: rotate(-102.85714deg); -ms-transform: rotate(-102.85714deg); transform: rotate(-102.85714deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-17 i { -webkit-transform: rotate(102.85714deg); -ms-transform: rotate(102.85714deg); transform: rotate(102.85714deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-18 { -webkit-transform: rotate(-109.28571deg); -ms-transform: rotate(-109.28571deg); transform: rotate(-109.28571deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-18 i { -webkit-transform: rotate(109.28571deg); -ms-transform: rotate(109.28571deg); transform: rotate(109.28571deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-19 { -webkit-transform: rotate(-115.71429deg); -ms-transform: rotate(-115.71429deg); transform: rotate(-115.71429deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-19 i { -webkit-transform: rotate(115.71429deg); -ms-transform: rotate(115.71429deg); transform: rotate(115.71429deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-20 { -webkit-transform: rotate(-122.14286deg); -ms-transform: rotate(-122.14286deg); transform: rotate(-122.14286deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-20 i { -webkit-transform: rotate(122.14286deg); -ms-transform: rotate(122.14286deg); transform: rotate(122.14286deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-21 { -webkit-transform: rotate(-128.57143deg); -ms-transform: rotate(-128.57143deg); transform: rotate(-128.57143deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-21 i { -webkit-transform: rotate(128.57143deg); -ms-transform: rotate(128.57143deg); transform: rotate(128.57143deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-22 { -webkit-transform: rotate(-135deg); -ms-transform: rotate(-135deg); transform: rotate(-135deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-22 i { -webkit-transform: rotate(135deg); -ms-transform: rotate(135deg); transform: rotate(135deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-23 { -webkit-transform: rotate(-141.42857deg); -ms-transform: rotate(-141.42857deg); transform: rotate(-141.42857deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-23 i { -webkit-transform: rotate(141.42857deg); -ms-transform: rotate(141.42857deg); transform: rotate(141.42857deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-24 { -webkit-transform: rotate(-147.85714deg); -ms-transform: rotate(-147.85714deg); transform: rotate(-147.85714deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-24 i { -webkit-transform: rotate(147.85714deg); -ms-transform: rotate(147.85714deg); transform: rotate(147.85714deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-25 { -webkit-transform: rotate(-154.28571deg); -ms-transform: rotate(-154.28571deg); transform: rotate(-154.28571deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-25 i { -webkit-transform: rotate(154.28571deg); -ms-transform: rotate(154.28571deg); transform: rotate(154.28571deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-26 { -webkit-transform: rotate(-160.71429deg); -ms-transform: rotate(-160.71429deg); transform: rotate(-160.71429deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-26 i { -webkit-transform: rotate(160.71429deg); -ms-transform: rotate(160.71429deg); transform: rotate(160.71429deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-27 { -webkit-transform: rotate(-167.14286deg); -ms-transform: rotate(-167.14286deg); transform: rotate(-167.14286deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-27 i { -webkit-transform: rotate(167.14286deg); -ms-transform: rotate(167.14286deg); transform: rotate(167.14286deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-28 { -webkit-transform: rotate(-173.57143deg); -ms-transform: rotate(-173.57143deg); transform: rotate(-173.57143deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-28 i { -webkit-transform: rotate(173.57143deg); -ms-transform: rotate(173.57143deg); transform: rotate(173.57143deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

#ray-29 { -webkit-transform: rotate(-180deg); -ms-transform: rotate(-180deg); transform: rotate(-180deg); -webkit-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; }
#ray-29 i { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

header h1, header h3 { text-align: center; text-transform: uppercase; font-size: 3em; font-weight: bold; margin: 0 1em; padding: 0.5em 0 0; text-shadow: 1px 1px 0px black; }
header h1 b, header h3 b { color: #362f34; }
header h1 i, header h3 i { color: #bed364; font-style: normal; }
header h3 { margin-top: 5px; font-size: 1.5em; }
header h3 a { text-shadow: none; }
header aside { position: fixed; top: 40px; right: 40px; width: 160px; z-index: 10; }

/* quick kills */
#body .twenty13 .ff36, #body .twenty10 .ie9, footer p label { display: none !important; }

footer { margin-top: 26px; width: 100%; }
footer p { text-align: center; text-transform: uppercase; }

::-moz-selection { background: #ff5e99; color: white; text-shadow: none; }

::selection { background: #ff5e99; color: white; text-shadow: none; }

/* http://twitter.com/miketaylr/status/12228805301 */
/* http://j.mp/webkit-tap-highlight-color */
a:link { -webkit-tap-highlight-color: #ff5e99; }

@media screen and (max-device-width: 480px) { /* All Capable Mobile Browser (Opera Mobile, iPhone Safari, Android Chrome) CSS goes here */
  html { -webkit-text-size-adjust: 100%; }
  p:target i { opacity: 1; }
  p.css3:target { background: rgba(190, 211, 100, 0.2); } }