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; }

body { line-height: 1; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }

/* Intro animations */
.intro nav { -webkit-animation: navDrop 1s 1 normal 8s; -webkit-animation-fill-mode: both; }

@-webkit-keyframes navDrop { 0% { -webkit-transform: translate3d(0px, -60px, 0px); }
  100% { -webkit-transform: translate3d(0px, 60px, 0px); } }

.intro #left-arm { -moz-transform-origin: 20px 12px; -webkit-transform-origin: 20px 12px; -o-transform-origin: 20px 12px; -ms-transform-origin: 20px 12px; transform-origin: 20px 12px; -webkit-animation: waveArm 4s 1 normal 1.5s; }

@-webkit-keyframes waveArm { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  10% { -moz-transform: rotate(80deg); -webkit-transform: rotate(80deg); -o-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); }
  50% { -moz-transform: rotate(80deg); -webkit-transform: rotate(80deg); -o-transform: rotate(80deg); -ms-transform: rotate(80deg); transform: rotate(80deg); }
  60% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

.intro #left-arm .humerus { -webkit-animation: waveHumerus 0.8s 3 normal 1.5s; }

@-webkit-keyframes waveHumerus { 0% { -moz-transform: rotate(20deg); -webkit-transform: rotate(20deg); -o-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); }
  50% { -moz-transform: rotate(60deg); -webkit-transform: rotate(60deg); -o-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); }
  100% { -moz-transform: rotate(20deg); -webkit-transform: rotate(20deg); -o-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); } }

.intro #left-arm .radius { -moz-transform-origin: 0px -7px; -webkit-transform-origin: 0px -7px; -o-transform-origin: 0px -7px; -ms-transform-origin: 0px -7px; transform-origin: 0px -7px; -webkit-animation: waveRadius 0.8s 3 normal 1.5s; }

@-webkit-keyframes waveRadius { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  50% { -moz-transform: rotate(95deg); -webkit-transform: rotate(95deg); -o-transform: rotate(95deg); -ms-transform: rotate(95deg); transform: rotate(95deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

.intro #left-arm .hand { -moz-transform-origin: 0% -135%; -webkit-transform-origin: 0% -135%; -o-transform-origin: 0% -135%; -ms-transform-origin: 0% -135%; transform-origin: 0% -135%; -webkit-animation: waveHand 0.8s 3 normal 1.5s; }

@-webkit-keyframes waveHand { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  50% { -moz-transform: rotate(110deg); -webkit-transform: rotate(110deg); -o-transform: rotate(110deg); -ms-transform: rotate(110deg); transform: rotate(110deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

.intro #me { -webkit-animation: jump 4.5s 1 normal 7s; -webkit-animation-fill-mode: both; }

@-webkit-keyframes jump { 0% { -webkit-transform: translate3d(0px, 0px, 0px); -webkit-animation-timing-function: ease; }
  5% { -webkit-transform: translate3d(0px, 10px, 0px); -webkit-animation-timing-function: ease; }
  6% { -webkit-transform: translate3d(0px, 0px, 0px); -webkit-animation-timing-function: ease; }
  15% { -webkit-transform: translate3d(0px, -200px, 0px); -webkit-animation-timing-function: ease-out; }
  25% { -webkit-transform: translate3d(0px, 0px, 0px); }
  35% { -webkit-transform: translate3d(0px, 10px, 0px); }
  35.5% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(0deg); -webkit-animation-timing-function: ease-in; }
  48% { -webkit-transform: translate3d(-175px, -200px, 0px) rotate(-180deg); -webkit-animation-timing-function: ease; }
  65% { -webkit-transform: translate3d(-380px, 0px, 0px) rotate(-360deg); -webkit-animation-timing-function: ease-out; }
  100% { -webkit-transform: translate3d(-380px, 0px, 0px) rotate(-360deg); -webkit-animation-timing-function: ease-out; } }

.intro .lower-body { -webkit-animation: jumpLowerBody 4.5s 1 normal 7s; }

@-webkit-keyframes jumpLowerBody { 0% { -webkit-transform: translate3d(0px, 0px, 0px); -webkit-animation-timing-function: ease; }
  5% { -webkit-transform: translate3d(0px, -10px, 0px); -webkit-animation-timing-function: ease; }
  6% { -webkit-transform: translate3d(0px, 0px, 0px); -webkit-animation-timing-function: ease-out; }
  15% { -webkit-transform: translate3d(0px, 0px, 0px); }
  25% { -webkit-transform: translate3d(0px, 0px, 0px); }
  35% { -webkit-transform: translate3d(0px, -10px, 0px); }
  35.5% { -webkit-transform: translate3d(0px, 0px, 0px); }
  100% { -webkit-transform: translate3d(0px, 0px, 0px); } }

.intro #right-arm { -moz-transform-origin: -15px 8px; -webkit-transform-origin: -15px 8px; -o-transform-origin: -15px 8px; -ms-transform-origin: -15px 8px; transform-origin: -15px 8px; -webkit-animation: punchArm 3s 1 normal 6.3s; }

@-webkit-keyframes punchArm { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  30% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  40% { -moz-transform: rotate(-80deg); -webkit-transform: rotate(-80deg); -o-transform: rotate(-80deg); -ms-transform: rotate(-80deg); transform: rotate(-80deg); }
  50% { -moz-transform: rotate(-80deg); -webkit-transform: rotate(-80deg); -o-transform: rotate(-80deg); -ms-transform: rotate(-80deg); transform: rotate(-80deg); }
  70% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

.intro #right-arm .humerus { -webkit-animation: punchHumerus 3s 1 normal 6.3s; }

@-webkit-keyframes punchHumerus { 0% { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
  30% { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
  40% { -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
  50% { -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
  70% { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
  100% { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); } }

.intro #right-arm .radius { -moz-transform-origin: 1px -6px; -webkit-transform-origin: 1px -6px; -o-transform-origin: 1px -6px; -ms-transform-origin: 1px -6px; transform-origin: 1px -6px; -webkit-animation: punchRadius 3s 1 normal 6.3s; }

@-webkit-keyframes punchRadius { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  30% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  40% { -moz-transform: rotate(-70deg); -webkit-transform: rotate(-70deg); -o-transform: rotate(-70deg); -ms-transform: rotate(-70deg); transform: rotate(-70deg); }
  50% { -moz-transform: rotate(-70deg); -webkit-transform: rotate(-70deg); -o-transform: rotate(-70deg); -ms-transform: rotate(-70deg); transform: rotate(-70deg); }
  70% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

.intro #right-arm .hand { -moz-transform-origin: 5px -15px; -webkit-transform-origin: 5px -15px; -o-transform-origin: 5px -15px; -ms-transform-origin: 5px -15px; transform-origin: 5px -15px; -webkit-animation: punchHand 3s 1 normal 6.3s; }

@-webkit-keyframes punchHand { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  30% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  40% { -moz-transform: rotate(-80deg); -webkit-transform: rotate(-80deg); -o-transform: rotate(-80deg); -ms-transform: rotate(-80deg); transform: rotate(-80deg); }
  50% { -moz-transform: rotate(-80deg); -webkit-transform: rotate(-80deg); -o-transform: rotate(-80deg); -ms-transform: rotate(-80deg); transform: rotate(-80deg); }
  70% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

.intro #left-leg { -webkit-animation: jumpLeftLeg 3s 1 normal 7s; }
.intro #left-leg .tibia { -webkit-animation: jumpLeftTibia 3s 1 normal 7s; }

.intro #left-foot { -webkit-animation: jumpLeftFoot 3s 1 normal 7s; }

@-webkit-keyframes jumpLeftLeg { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  10% { -moz-transform: rotate(5deg); -webkit-transform: rotate(5deg); -o-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); }
  12% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  13% { -moz-transform: rotate(5deg); -webkit-transform: rotate(5deg); -o-transform: rotate(5deg); -ms-transform: rotate(5deg); transform: rotate(5deg); }
  15% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

@-webkit-keyframes jumpLeftTibia { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  10% { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
  12% { -moz-transform: rotate(0); -webkit-transform: rotate(0); -o-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); }
  13% { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
  15% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

@-webkit-keyframes jumpLeftFoot { 0% { left: -7px; }
  10% { left: -5px; }
  12% { left: -7px; }
  13% { -moz-transform: rotate(-10deg); -webkit-transform: rotate(-10deg); -o-transform: rotate(-10deg); -ms-transform: rotate(-10deg); transform: rotate(-10deg); }
  100% { -moz-transform: rotate(0); -webkit-transform: rotate(0); -o-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); } }

.intro #right-leg { -webkit-animation: jumpRightLeg 3s 1 normal 7s; }
.intro #right-leg .tibia { -webkit-animation: jumpRightTibia 3s 1 normal 7s; }

.intro #right-foot { -webkit-animation: jumpRightFoot 3s 1 normal 7s; }

@-webkit-keyframes jumpRightLeg { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  10% { -moz-transform: rotate(-5deg); -webkit-transform: rotate(-5deg); -o-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); }
  12% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

@-webkit-keyframes jumpRightTibia { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  10% { -moz-transform: rotate(20deg); -webkit-transform: rotate(20deg); -o-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); }
  12% { -moz-transform: rotate(0); -webkit-transform: rotate(0); -o-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } }

@-webkit-keyframes jumpRightFoot { 0% { right: -7px; }
  10% { right: -5px; }
  12% { right: -7px; }
  100% { right: -7px; } }

.intro #intro h1 { -webkit-animation: introName 4s 1 normal 0; }
.intro #intro p { -webkit-animation: introText 3s 1 normal 3.5s; }
.intro #intro h2 { -webkit-animation: introNinja 4s 1 normal 5.4s; }

@-webkit-keyframes introName { 0% { opacity: 1; }
  80% { opacity: 1; }
  100% { opacity: 0; } }

@-webkit-keyframes introText { 0% { opacity: 0; }
  10% { opacity: 1; }
  55% { opacity: 1; }
  60% { opacity: 1; }
  100% { opacity: 0; } }

@-webkit-keyframes introNinja { 0% { opacity: 0; top: 160px; left: -80px; }
  10% { text-shadow: 0px 0px 0 #ec5e5e, -0.643px 0.766px 0 #ec5e5e, -1.286px 1.532px 0 #ec5e5e, -1.928px 2.298px 0 #ec5e5e, -2.571px 3.064px 0 #ec5e5e, -3.214px 3.83px 0 #ec5e5e, -3.857px 4.596px 0 #ec5e5e, -4.5px 5.362px 0 #ec5d5d, -5.142px 6.128px 0 #ec5d5d, -5.785px 6.894px 0 #ec5d5d, -6.428px 7.66px 0 #ec5d5d, -7.071px 8.426px 0 #ec5c5c, -7.713px 9.193px 0 #ec5c5c, -8.356px 9.959px 0 #ec5c5c, -8.999px 10.725px 0 #ec5c5c, -9.642px 11.491px 0 #ec5b5b, -10.285px 12.257px 0 #ec5b5b, -10.927px 13.023px 0 #ec5b5b, -11.57px 13.789px 0 #ec5a5a, -12.213px 14.555px 0 #eb5a5a, -12.856px 15.321px 0 #eb5959, -13.499px 16.087px 0 #eb5959, -14.141px 16.853px 0 #eb5858, -14.784px 17.619px 0 #eb5858, -15.427px 18.385px 0 #eb5757, -16.07px 19.151px 0 #eb5757, -16.712px 19.917px 0 #eb5656, -17.355px 20.683px 0 #eb5555, -17.998px 21.449px 0 #eb5555, -18.641px 22.215px 0 #eb5454, -19.284px 22.981px 0 #eb5353, -19.926px 23.747px 0 #eb5353, -20.569px 24.513px 0 #eb5252, -21.212px 25.279px 0 #ea5151, -21.855px 26.046px 0 #ea5050, -22.498px 26.812px 0 #ea5050, -23.14px 27.578px 0 #ea4f4f, -23.783px 28.344px 0 #ea4e4e, -24.426px 29.11px 0 #ea4d4d, -25.069px 29.876px 0 #ea4c4c, -25.712px 30.642px 0 #ea4b4b, -26.354px 31.408px 0 #ea4a4a, -26.997px 32.174px 0 #ea4949, -27.64px 32.94px 0 #e94848, -28.283px 33.706px 0 #e94747, -28.925px 34.472px 0 #e94646, -29.568px 35.238px 0 #e94545, -30.211px 36.004px 0 #e94444, -30.854px 36.77px 0 #e94343, -31.497px 37.536px 0 #e94242, -32.139px 38.302px 0 #e94141, -32.782px 39.068px 0 #e84040, -33.425px 39.834px 0 #e83f3f, -34.068px 40.6px 0 #e83d3d, -34.711px 41.366px 0 #e83c3c, -35.353px 42.132px 0 #e83b3b, -35.996px 42.898px 0 #e83a3a, -36.639px 43.665px 0 #e83838, -37.282px 44.431px 0 #e73737, -37.924px 45.197px 0 #e73636, -38.567px 45.963px 0 #e73434, -39.21px 46.729px 0 #e73333, -39.853px 47.495px 0 #e73131, -40.496px 48.261px 0 #e73030, -41.138px 49.027px 0 #e62f2f, -41.781px 49.793px 0 #e62d2d, -42.424px 50.559px 0 #e62c2c, -43.067px 51.325px 0 #e62a2a, -43.71px 52.091px 0 #e62828, -44.352px 52.857px 0 #e52727, -44.995px 53.623px 0 #e52525, -45.638px 54.389px 0 #e52424, -46.281px 55.155px 0 #e52222, -46.923px 55.921px 0 #e52020, -47.566px 56.687px 0 #e51f1f, -48.209px 57.453px 0 #e41d1d, -48.852px 58.219px 0 #e41b1b, -49.495px 58.985px 0 #e31b1b, -50.137px 59.751px 0 #e11b1b, -50.78px 60.518px 0 #df1a1a, -51.423px 61.284px 0 #dd1a1a; opacity: 1; top: 80px; left: 0; }
  20% { text-shadow: 0px 0px 0 #ec5e5e, -0.643px 0.766px 0 #ec5e5e, -1.286px 1.532px 0 #ec5e5e, -1.928px 2.298px 0 #ec5e5e, -2.571px 3.064px 0 #ec5e5e, -3.214px 3.83px 0 #ec5e5e, -3.857px 4.596px 0 #ec5e5e, -4.5px 5.362px 0 #ec5d5d, -5.142px 6.128px 0 #ec5d5d, -5.785px 6.894px 0 #ec5d5d, -6.428px 7.66px 0 #ec5d5d, -7.071px 8.426px 0 #ec5c5c, -7.713px 9.193px 0 #ec5c5c, -8.356px 9.959px 0 #ec5c5c, -8.999px 10.725px 0 #ec5c5c, -9.642px 11.491px 0 #ec5b5b, -10.285px 12.257px 0 #ec5b5b, -10.927px 13.023px 0 #ec5b5b, -11.57px 13.789px 0 #ec5a5a, -12.213px 14.555px 0 #eb5a5a, -12.856px 15.321px 0 #eb5959, -13.499px 16.087px 0 #eb5959, -14.141px 16.853px 0 #eb5858, -14.784px 17.619px 0 #eb5858, -15.427px 18.385px 0 #eb5757, -16.07px 19.151px 0 #eb5757, -16.712px 19.917px 0 #eb5656, -17.355px 20.683px 0 #eb5555, -17.998px 21.449px 0 #eb5555, -18.641px 22.215px 0 #eb5454, -19.284px 22.981px 0 #eb5353, -19.926px 23.747px 0 #eb5353, -20.569px 24.513px 0 #eb5252, -21.212px 25.279px 0 #ea5151, -21.855px 26.046px 0 #ea5050, -22.498px 26.812px 0 #ea5050, -23.14px 27.578px 0 #ea4f4f, -23.783px 28.344px 0 #ea4e4e, -24.426px 29.11px 0 #ea4d4d, -25.069px 29.876px 0 #ea4c4c, -25.712px 30.642px 0 #ea4b4b, -26.354px 31.408px 0 #ea4a4a, -26.997px 32.174px 0 #ea4949, -27.64px 32.94px 0 #e94848, -28.283px 33.706px 0 #e94747, -28.925px 34.472px 0 #e94646, -29.568px 35.238px 0 #e94545, -30.211px 36.004px 0 #e94444, -30.854px 36.77px 0 #e94343, -31.497px 37.536px 0 #e94242, -32.139px 38.302px 0 #e94141, -32.782px 39.068px 0 #e84040, -33.425px 39.834px 0 #e83f3f, -34.068px 40.6px 0 #e83d3d, -34.711px 41.366px 0 #e83c3c, -35.353px 42.132px 0 #e83b3b, -35.996px 42.898px 0 #e83a3a, -36.639px 43.665px 0 #e83838, -37.282px 44.431px 0 #e73737, -37.924px 45.197px 0 #e73636, -38.567px 45.963px 0 #e73434, -39.21px 46.729px 0 #e73333, -39.853px 47.495px 0 #e73131, -40.496px 48.261px 0 #e73030, -41.138px 49.027px 0 #e62f2f, -41.781px 49.793px 0 #e62d2d, -42.424px 50.559px 0 #e62c2c, -43.067px 51.325px 0 #e62a2a, -43.71px 52.091px 0 #e62828, -44.352px 52.857px 0 #e52727, -44.995px 53.623px 0 #e52525, -45.638px 54.389px 0 #e52424, -46.281px 55.155px 0 #e52222, -46.923px 55.921px 0 #e52020, -47.566px 56.687px 0 #e51f1f, -48.209px 57.453px 0 #e41d1d, -48.852px 58.219px 0 #e41b1b, -49.495px 58.985px 0 #e31b1b, -50.137px 59.751px 0 #e11b1b, -50.78px 60.518px 0 #df1a1a, -51.423px 61.284px 0 #dd1a1a; opacity: 1; }
  28% { text-shadow: 0px 0px 0 #ec5e5e; opacity: 1; }
  53% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); top: 80px; left: 0; opacity: 1; }
  55% { -moz-transform: rotate(500deg); -webkit-transform: rotate(500deg); -o-transform: rotate(500deg); -ms-transform: rotate(500deg); transform: rotate(500deg); top: -300px; left: 80px; opacity: 1; }
  100% { -moz-transform: rotate(700deg); -webkit-transform: rotate(700deg); -o-transform: rotate(700deg); -ms-transform: rotate(700deg); transform: rotate(700deg); top: -500px; left: 80px; opacity: 1; } }

.about .dots li:nth-child(1) { -webkit-animation: popDots 2s 1 normal 0ms; -webkit-animation-fill-mode: both; }
.about .dots li:nth-child(2) { -webkit-animation: popDots 2s 1 normal 120ms; -webkit-animation-fill-mode: both; }
.about .dots li:nth-child(3) { -webkit-animation: popDots 2s 1 normal 240ms; -webkit-animation-fill-mode: both; }
.about .dots li:nth-child(4) { -webkit-animation: popDots 2s 1 normal 360ms; -webkit-animation-fill-mode: both; }
.about .dots li:nth-child(5) { -webkit-animation: popDots 2s 1 normal 480ms; -webkit-animation-fill-mode: both; }
.about .dots li:nth-child(6) { -webkit-animation: popDots 2s 1 normal 600ms; -webkit-animation-fill-mode: both; }
.about .dots li:nth-child(7) { -webkit-animation: popDots 2s 1 normal 720ms; -webkit-animation-fill-mode: both; }
.about .us { -webkit-animation-fill-mode: both; }
.about .dakota { -webkit-animation-fill-mode: both; }
.about .csuf { -webkit-animation-fill-mode: both; }
.about .info { -webkit-animation: infoFade 2s 1 normal 500ms; -webkit-animation-fill-mode: both; }

@-webkit-keyframes popDots { 0% { -moz-transform: scale(0, 0); -webkit-transform: scale(0, 0); -o-transform: scale(0, 0); -ms-transform: scale(0, 0); transform: scale(0, 0); }
  20% { -moz-transform: scale(0, 0); -webkit-transform: scale(0, 0); -o-transform: scale(0, 0); -ms-transform: scale(0, 0); transform: scale(0, 0); }
  25% { -moz-transform: scale(1.1, 1.1); -webkit-transform: scale(1.1, 1.1); -o-transform: scale(1.1, 1.1); -ms-transform: scale(1.1, 1.1); transform: scale(1.1, 1.1); }
  30% { -moz-transform: scale(1, 1); -webkit-transform: scale(1, 1); -o-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); }
  100% { -moz-transform: scale(1, 1); -webkit-transform: scale(1, 1); -o-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); } }

@-webkit-keyframes infoFade { 0% { opacity: 0; -webkit-animation-timing-function: ease-out; }
  100% { opacity: 1; } }

/* Skill positions */
.skills .punch #right-arm { -moz-transform-origin: 0% 50%; -webkit-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; -moz-transform: rotate(-30deg); -webkit-transform: rotate(-30deg); -o-transform: rotate(-30deg); -ms-transform: rotate(-30deg); transform: rotate(-30deg); }
.skills .punch #right-arm .humerus { -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
.skills .punch #right-arm .radius { top: -8px; right: -8px; -moz-transform: rotate(-140deg); -webkit-transform: rotate(-140deg); -o-transform: rotate(-140deg); -ms-transform: rotate(-140deg); transform: rotate(-140deg); }
.skills .punch #right-arm .hand { top: 9px; right: -16px; }
.skills #me.kick { bottom: -8px; -moz-transform: rotate(-30deg); -webkit-transform: rotate(-30deg); -o-transform: rotate(-30deg); -ms-transform: rotate(-30deg); transform: rotate(-30deg); }
.skills #me.kick #right-leg { top: 5px; -moz-transform: rotate(-60deg); -webkit-transform: rotate(-60deg); -o-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg); }
.skills #me.kick #left-leg { top: 10px; -moz-transform: rotate(30deg); -webkit-transform: rotate(30deg); -o-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); }
.skills .closeline #left-arm { -moz-transform-origin: 0% 50%; -webkit-transform-origin: 0% 50%; -o-transform-origin: 0% 50%; -ms-transform-origin: 0% 50%; transform-origin: 0% 50%; left: 25px; top: -5px; -moz-transform: rotate(40deg); -webkit-transform: rotate(40deg); -o-transform: rotate(40deg); -ms-transform: rotate(40deg); transform: rotate(40deg); }
.skills .closeline #left-arm .humerus { -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.skills .closeline #left-arm .radius { left: -9px; -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.skills .closeline #left-arm .hand { left: -23px; }
.skills .uppercut #right-arm { right: 20px; -moz-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -moz-transform: rotate(-70deg); -webkit-transform: rotate(-70deg); -o-transform: rotate(-70deg); -ms-transform: rotate(-70deg); transform: rotate(-70deg); }
.skills .uppercut #right-arm .humerus { -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
.skills .uppercut #right-arm .radius { top: -4px; right: -6px; -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); }
.skills .uppercut #right-arm .hand { top: 24px; left: 24px; }
.skills #me.sweepkick { bottom: -25px; }
.skills #me.sweepkick .leg { top: -5px; }
.skills #me.sweepkick #left-leg { top: 5px; -moz-transform: rotate(60deg); -webkit-transform: rotate(60deg); -o-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); }
.skills #me.sweepkick #right-foot { top: 34px; }
.skills .crane #right-leg { top: -8px; }
.skills .crane #right-foot { top: 33px; }
.skills .crane #right-arm { right: 20px; -moz-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -moz-transform: rotate(-70deg); -webkit-transform: rotate(-70deg); -o-transform: rotate(-70deg); -ms-transform: rotate(-70deg); transform: rotate(-70deg); }
.skills .crane #right-arm .humerus { -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
.skills .crane #right-arm .radius { top: -4px; right: -6px; -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); }
.skills .crane #right-arm .hand { top: 25px; left: 23px; }
.skills .crane #left-arm { left: 30px; top: -5px; -moz-transform-origin: 0% 0%; -webkit-transform-origin: 0% 0%; -o-transform-origin: 0% 0%; -ms-transform-origin: 0% 0%; transform-origin: 0% 0%; -moz-transform: rotate(70deg); -webkit-transform: rotate(70deg); -o-transform: rotate(70deg); -ms-transform: rotate(70deg); transform: rotate(70deg); }
.skills .crane #left-arm .humerus { -moz-transform: rotate(50deg); -webkit-transform: rotate(50deg); -o-transform: rotate(50deg); -ms-transform: rotate(50deg); transform: rotate(50deg); }
.skills .crane #left-arm .radius { top: -2px; left: -10px; -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg); transform: rotate(90deg); }
.skills .crane #left-arm .hand { top: 28px; left: -28px; }
.skills #me.flyingkick { bottom: 60px; -moz-transform: rotate(-5deg); -webkit-transform: rotate(-5deg); -o-transform: rotate(-5deg); -ms-transform: rotate(-5deg); transform: rotate(-5deg); }
.skills #me.flyingkick #right-leg { top: 4px; -moz-transform: rotate(-90deg); -webkit-transform: rotate(-90deg); -o-transform: rotate(-90deg); -ms-transform: rotate(-90deg); transform: rotate(-90deg); }
.skills #me.flyingkick #left-leg { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); }
.skills #me.flyingkick #left-leg .tibia { top: 15px; -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
.skills #me.flyingkick #left-leg .foot { left: 12px; top: 29px; -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
.skills .bearhug #right-arm { right: 20px; -moz-transform: rotate(-40deg); -webkit-transform: rotate(-40deg); -o-transform: rotate(-40deg); -ms-transform: rotate(-40deg); transform: rotate(-40deg); }
.skills .bearhug #right-arm .humerus { -moz-transform: rotate(-50deg); -webkit-transform: rotate(-50deg); -o-transform: rotate(-50deg); -ms-transform: rotate(-50deg); transform: rotate(-50deg); }
.skills .bearhug #right-arm .radius { top: -4px; right: -9px; -moz-transform: rotate(-45deg); -webkit-transform: rotate(-45deg); -o-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); }
.skills .bearhug #right-arm .hand { top: 40px; left: 21px; }
.skills .bearhug #left-arm { left: 20px; top: 0px; -moz-transform: rotate(40deg); -webkit-transform: rotate(40deg); -o-transform: rotate(40deg); -ms-transform: rotate(40deg); transform: rotate(40deg); }
.skills .bearhug #left-arm .humerus { -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.skills .bearhug #left-arm .radius { left: -9px; -moz-transform: rotate(45deg); -webkit-transform: rotate(45deg); -o-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); }
.skills .bearhug #left-arm .hand { left: -23px; }

.skills .head:before { content: ""; position: absolute; top: 25px; left: 13px; width: 67px; height: 10px; background: #f43131; }
.skills .headband { width: 50px; height: 50px; position: absolute; left: 0px; top: 65px; z-index: 0; }
.skills .headband ol { position: absolute; }
.skills .headband li { background: url('../images/body/straps.png?1302057887') no-repeat; height: 27px; position: absolute; }
.skills .top-strap { width: 24px; left: -1px; -webkit-animation: topStrap 3s infinite normal; }
.skills .bottom-strap { width: 11px; left: 16px; top: 10px; background-position: -27px 0; -webkit-animation: bottomStrap 3.5s infinite normal; }

@-webkit-keyframes topStrap { 0% { -moz-transform: rotate(40deg); -webkit-transform: rotate(40deg); -o-transform: rotate(40deg); -ms-transform: rotate(40deg); transform: rotate(40deg); -webkit-animation-timing-function: ease-out; }
  30% { -moz-transform: rotate(60deg); -webkit-transform: rotate(60deg); -o-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); }
  50% { -moz-transform: rotate(20deg); -webkit-transform: rotate(20deg); -o-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); }
  80% { -moz-transform: rotate(50deg); -webkit-transform: rotate(50deg); -o-transform: rotate(50deg); -ms-transform: rotate(50deg); transform: rotate(50deg); -webkit-animation-timing-function: ease-in; }
  100% { -moz-transform: rotate(40deg); -webkit-transform: rotate(40deg); -o-transform: rotate(40deg); -ms-transform: rotate(40deg); transform: rotate(40deg); } }

@-webkit-keyframes bottomStrap { 0% { -moz-transform: rotate(30deg); -webkit-transform: rotate(30deg); -o-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); -webkit-animation-timing-function: ease-out; }
  30% { -moz-transform: rotate(60deg); -webkit-transform: rotate(60deg); -o-transform: rotate(60deg); -ms-transform: rotate(60deg); transform: rotate(60deg); }
  50% { -moz-transform: rotate(25deg); -webkit-transform: rotate(25deg); -o-transform: rotate(25deg); -ms-transform: rotate(25deg); transform: rotate(25deg); -webkit-animation-timing-function: ease-in; }
  70% { -moz-transform: rotate(50deg); -webkit-transform: rotate(50deg); -o-transform: rotate(50deg); -ms-transform: rotate(50deg); transform: rotate(50deg); }
  100% { -moz-transform: rotate(30deg); -webkit-transform: rotate(30deg); -o-transform: rotate(30deg); -ms-transform: rotate(30deg); transform: rotate(30deg); } }

.contact #paper { -webkit-animation: paperSpin 2.5s 1 normal; -webkit-animation-fill-mode: both; }
.contact #me #right-arm { -webkit-animation: throwStarArm 2s 1 normal 300ms; }
.contact #me #right-arm .radius { -webkit-animation: throwStarRadius 2s 1 normal 300ms; }
.contact #me #right-arm .hand { -webkit-animation: throwStarHand 2s 1 normal 300ms; }
.contact .star-top-left { opacity: 0; -webkit-animation: throwStarTopLeft 2s 1 normal 300ms; -webkit-animation-fill-mode: both; }
.contact .star-top-right { opacity: 0; -webkit-animation: throwStarTopRight 2s 1 normal 300ms; -webkit-animation-fill-mode: both; }
.contact .star-bottom-left { opacity: 0; -webkit-animation: throwStarBottomLeft 2s 1 normal 300ms; -webkit-animation-fill-mode: both; }
.contact .star-bottom-right { opacity: 0; -webkit-animation: throwStarBottomRight 2s 1 normal 300ms; -webkit-animation-fill-mode: both; }

@-webkit-keyframes paperSpin { 0% { -moz-transform:  scale(0, 0) rotateZ(300deg); -webkit-transform:  scale(0, 0) rotateZ(300deg); -o-transform:  scale(0, 0) rotateZ(300deg); -ms-transform:  scale(0, 0) rotateZ(300deg); transform:  scale(0, 0) rotateZ(300deg); -webkit-animation-timing-function: ease-in; }
  90% { -moz-transform:  scale(1, 1) rotateZ(0deg); -webkit-transform:  scale(1, 1) rotateZ(0deg); -o-transform:  scale(1, 1) rotateZ(0deg); -ms-transform:  scale(1, 1) rotateZ(0deg); transform:  scale(1, 1) rotateZ(0deg); }
  95% { -moz-transform:  scale(1, 1) rotateZ(-5deg); -webkit-transform:  scale(1, 1) rotateZ(-5deg); -o-transform:  scale(1, 1) rotateZ(-5deg); -ms-transform:  scale(1, 1) rotateZ(-5deg); transform:  scale(1, 1) rotateZ(-5deg); }
  100% { -moz-transform:  scale(1, 1) rotateZ(-5deg); -webkit-transform:  scale(1, 1) rotateZ(-5deg); -o-transform:  scale(1, 1) rotateZ(-5deg); -ms-transform:  scale(1, 1) rotateZ(-5deg); transform:  scale(1, 1) rotateZ(-5deg); } }

@-webkit-keyframes throwStarArm { 0% { -moz-transform: rotate(0); -webkit-transform: rotate(0); -o-transform: rotate(0); -ms-transform: rotate(0); transform: rotate(0); }
  35% { -moz-transform: rotate(-80deg); -webkit-transform: rotate(-80deg); -o-transform: rotate(-80deg); -ms-transform: rotate(-80deg); transform: rotate(-80deg); right: 25px; top: -8px; }
  90% { -moz-transform: rotate(-80deg); -webkit-transform: rotate(-80deg); -o-transform: rotate(-80deg); -ms-transform: rotate(-80deg); transform: rotate(-80deg); right: 25px; top: -8px; }
  100% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); right: 8px; top: 0; } }

@-webkit-keyframes throwStarRadius { 0% { -moz-transform: rotate(0deg); -webkit-transform: rotate(0deg); -o-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); }
  35% { -moz-transform: rotate(-60deg); -webkit-transform: rotate(-60deg); -o-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg); }
  90% { -moz-transform: rotate(-60deg); -webkit-transform: rotate(-60deg); -o-transform: rotate(-60deg); -ms-transform: rotate(-60deg); transform: rotate(-60deg); }
  100% { -moz-transform: rotate(20deg); -webkit-transform: rotate(20deg); -o-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); } }

@-webkit-keyframes throwStarHand { 0% { right: 0; top: 45px; }
  35% { top: 36px; right: -16px; }
  90% { top: 36px; right: -16px; }
  100% { right: 0; top: 45px; } }

@-webkit-keyframes throwStarTopLeft { 0% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 0; }
  1% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 1; }
  35% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  90% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  99% { -webkit-transform: translate3d(255px, -440px, 0px) rotate(45deg); opacity: 1; background-position: 0 0; }
  100% { -webkit-transform: translate3d(255px, -440px, 0px) rotate(45deg); opacity: 1; background-position: 10px 0; } }

@-webkit-keyframes throwStarTopRight { 0% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 0; }
  1% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 1; }
  35% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  90% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  99% { -webkit-transform: translate3d(530px, -470px, 0px) rotate(45deg); background-position: 0 0; }
  100% { -webkit-transform: translate3d(530px, -470px, 0px) rotate(45deg); opacity: 1; background-position: 10px 0; } }

@-webkit-keyframes throwStarBottomRight { 0% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 0; }
  1% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 1; }
  35% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  90% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  99% { -webkit-transform: translate3d(565px, -100px, 0px) rotate(45deg); opacity: 1; background-position: 0 0; }
  100% { -webkit-transform: translate3d(565px, -100px, 0px) rotate(45deg); opacity: 1; background-position: 10px 0; } }

@-webkit-keyframes throwStarBottomLeft { 0% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 0; }
  1% { -webkit-transform: translate3d(0px, 0px, 0px) rotate(45deg); opacity: 1; }
  35% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  90% { -webkit-transform: translate3d(-70px, -8px, 0px) rotate(-55deg); opacity: 1; }
  99% { -webkit-transform: translate3d(280px, -70px, 0px) rotate(45deg); opacity: 1; background-position: 0 0; }
  100% { -webkit-transform: translate3d(280px, -70px, 0px) rotate(45deg); opacity: 1; background-position: 10px 0; } }

body { background: #242424; font-size: 100%; }

nav { width: 100%; height: 60px; position: absolute; z-index: 200; top: -60px; background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1f1f1f), color-stop(100%, #141414)); background: -moz-linear-gradient(#1f1f1f, #141414); background: linear-gradient(#1f1f1f, #141414); font-family: "museo-sans-1", "museo-sans-2", sans-serif; }
nav ul { width: 960px; margin: auto; overflow: hidden; }
nav li { float: left; width: 33%; }
nav li.current button { background-color: #242424; }
nav button { cursor: pointer; text-transform: uppercase; height: 60px; width: 100%; text-align: center; margin: 0; border: 0; color: #eeeeee; background: transparent; }
nav button:hover { background-color: #080808; }

#wrapper { width: 960px; height: 650px; margin: 20px auto; position: relative; overflow: hidden; border-bottom: solid 1px #313131; background: -webkit-gradient(radial, 50% 100%, 0, 50% 100%, 400, color-stop(0%, #313131), color-stop(100%, #242424)); background: -moz-radial-gradient(50% 100%, #313131, #242424 400px); background: radial-gradient(50% 100%, #313131, #242424 400px); z-index: 100; }

.slider { width: 3000px; position: absolute; -moz-transition-property: left; -webkit-transition-property: left; -o-transition-property: left; transition-property: left; -moz-transition-duration: 400ms; -webkit-transition-duration: 400ms; -o-transition-duration: 400ms; transition-duration: 400ms; -moz-transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); -webkit-transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); -o-transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); -moz-transition-delay: 0; -webkit-transition-delay: 0; -o-transition-delay: 0; transition-delay: 0; }

#intro { color: #dddddd; text-align: center; position: relative; z-index: 100; display: none; font-family: "ff-meta-serif-web-pro-1", "ff-meta-serif-web-pro-2", serif; }
#intro h1 { font-size: 120px; position: absolute; top: 125px; font-weight: 700; width: 100%; opacity: 0; font-family: "ff-meta-serif-web-pro-1", "ff-meta-serif-web-pro-2", serif; }
#intro p { position: absolute; top: 80px; font-size: 69px; width: 100%; top: 164px; opacity: 0; }
#intro h2 { font-size: 136px; position: absolute; top: 80px; left: 0; width: 100%; opacity: 0; font-family: "quatro-1", "quatro-2", "Arial Black", sans-serif; }

#me { width: 90px; height: 218px; position: absolute; bottom: 0; left: 43%; z-index: 500; display: none; }

.head { width: 95px; height: 95px; background: url('../images/body/head.png?1302038743') no-repeat; position: relative; top: 3px; z-index: 100; }

.upper-body { position: relative; width: 90px; height: 60px; margin: 0 auto; }

.chest { position: absolute; width: 35px; height: 60px; left: 1.85em; -moz-border-radius: 0.5em 0.5em 0 0; -webkit-border-radius: 0.5em 0.5em 0 0; -o-border-radius: 0.5em 0.5em 0 0; -ms-border-radius: 0.5em 0.5em 0 0; -khtml-border-radius: 0.5em 0.5em 0 0; border-radius: 0.5em 0.5em 0 0; background: #101010; }

.shoulder { position: absolute; top: 0px; width: 37px; height: 74px; background: url('../images/body/shoulders.png?1302038744') no-repeat; }

#left-shoulder { left: 0px; }

#right-shoulder { right: 0; background-position: -37px 0; }

.arm { position: absolute; }
.arm .humerus { position: relative; height: 25px; width: 7px; background: #e6bf99; -moz-transform-origin: 20% 20%; -webkit-transform-origin: 20% 20%; -o-transform-origin: 20% 20%; -ms-transform-origin: 20% 20%; transform-origin: 20% 20%; -moz-border-radius: 2em; -webkit-border-radius: 2em; -o-border-radius: 2em; -ms-border-radius: 2em; -khtml-border-radius: 2em; border-radius: 2em; }
.arm .radius { -moz-transform-origin: center top; -webkit-transform-origin: center top; -o-transform-origin: center top; -ms-transform-origin: center top; transform-origin: center top; position: relative; height: 15px; width: 7px; top: 1px; background: #e6bf99; -moz-border-radius: 2em; -webkit-border-radius: 2em; -o-border-radius: 2em; -ms-border-radius: 2em; -khtml-border-radius: 2em; border-radius: 2em; }

#left-arm { top: 0px; left: 9px; }
#left-arm ol { position: absolute; left: 0px; top: 20px; }
#left-arm .humerus { -moz-transform: rotate(20deg); -webkit-transform: rotate(20deg); -o-transform: rotate(20deg); -ms-transform: rotate(20deg); transform: rotate(20deg); margin: -5px 5px; }
#left-arm .radius { left: -2px; }
#left-arm .hand { left: -2px; }

#right-arm { top: 0px; right: 8px; }
#right-arm ol { position: absolute; left: 0px; top: 20px; }
#right-arm .humerus { -moz-transform: rotate(-20deg); -webkit-transform: rotate(-20deg); -o-transform: rotate(-20deg); -ms-transform: rotate(-20deg); transform: rotate(-20deg); margin: -5px -5px; }
#right-arm .radius { right: -2px; }
#right-arm .hand { right: 0; }

.hand { position: relative; top: 45px; width: 10px; height: 10px; background: #e6bf99; -moz-border-radius: 2em; -webkit-border-radius: 2em; -o-border-radius: 2em; -ms-border-radius: 2em; -khtml-border-radius: 2em; border-radius: 2em; }

.lower-body { position: relative; width: 90px; margin: 0 auto; }

.waist { position: absolute; width: 35px; height: 16px; left: 1.85em; background: #070c29; }

.leg { width: 13px; height: 40px; position: absolute; top: 16px; }
.leg .femur { position: absolute; height: 20px; width: 100%; background: #070c29; -moz-transform-origin: 50% 0; -webkit-transform-origin: 50% 0; -o-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; }
.leg .tibia { position: absolute; height: 20px; width: 100%; background: #070c29; top: 20px; -moz-transform-origin: 50% 0; -webkit-transform-origin: 50% 0; -o-transform-origin: 50% 0; -ms-transform-origin: 50% 0; transform-origin: 50% 0; }

#left-leg { left: 29px; -moz-transform-origin: 0 0; -webkit-transform-origin: 0 0; -o-transform-origin: 0 0; -ms-transform-origin: 0 0; transform-origin: 0 0; }

#right-leg { right: 26px; -moz-transform-origin: 100% 0; -webkit-transform-origin: 100% 0; -o-transform-origin: 100% 0; -ms-transform-origin: 100% 0; transform-origin: 100% 0; }

.foot { width: 20px; height: 8px; position: absolute; top: 38px; background: #101010; }

#left-foot { left: -7px; -moz-border-radius: 5px 0 0 5px; -webkit-border-radius: 5px 0 0 5px; -o-border-radius: 5px 0 0 5px; -ms-border-radius: 5px 0 0 5px; -khtml-border-radius: 5px 0 0 5px; border-radius: 5px 0 0 5px; }

#right-foot { right: -7px; -moz-border-radius: 0 5px 5px 0; -webkit-border-radius: 0 5px 5px 0; -o-border-radius: 0 5px 5px 0; -ms-border-radius: 0 5px 5px 0; -khtml-border-radius: 0 5px 5px 0; border-radius: 0 5px 5px 0; }

.about #me { left: 3.5%; }
.about nav { top: 0; }

#about { z-index: 200; position: relative; width: 960px; height: 650px; float: left; }
#about .info { width: 500px; float: right; margin-right: 20px; padding: 80px 0 0; opacity: 0; }
#about .info em { color: #f7887d; }
#about h3 { font-size: 25px; color: #f56556; font-weight: 100; font-family: "museo-sans-1", "museo-sans-2", sans-serif; }
#about p { color: white; margin: 15px 0; line-height: 1.6; font-size: 13px; font-family: "ff-meta-serif-web-pro-1", "ff-meta-serif-web-pro-2", serif; }
#about ul { position: relative; }
#about li { position: absolute; width: 200px; height: 200px; overflow: hidden; z-index: 10; opacity: 1; -moz-transform: scale(0, 0); -webkit-transform: scale(0, 0); -o-transform: scale(0, 0); -ms-transform: scale(0, 0); transform: scale(0, 0); -moz-border-radius: 10em; -webkit-border-radius: 10em; -o-border-radius: 10em; -ms-border-radius: 10em; -khtml-border-radius: 10em; border-radius: 10em; -moz-transition-property: all; -webkit-transition-property: all; -o-transition-property: all; transition-property: all; -moz-transition-duration: 800ms; -webkit-transition-duration: 800ms; -o-transition-duration: 800ms; transition-duration: 800ms; -moz-transition-timing-function: cubic-bezier(0.000, 0.000, 0.580, 1.000); -webkit-transition-timing-function: cubic-bezier(0.000, 0.000, 0.580, 1.000); -o-transition-timing-function: cubic-bezier(0.000, 0.000, 0.580, 1.000); transition-timing-function: cubic-bezier(0.000, 0.000, 0.580, 1.000); -moz-transition-delay: 0; -webkit-transition-delay: 0; -o-transition-delay: 0; transition-delay: 0; }
#about .us { top: 105px; left: 55px; width: 165px; height: 165px; background: url('../images/about/meandkatie.jpg?1302038742') -30px -10px no-repeat; }
#about .us:hover { background-position: -55px -12px; }
#about .location { top: 370px; left: 259px; width: 90px; height: 90px; background: url('../images/about/location.png?1302038741') -20px -80px no-repeat; }
#about .location:hover { background-position: -50px -90px; }
#about .dakota { top: 210px; left: 250px; background: url('../images/about/dakota.jpg?1302044927') -40px -100px no-repeat; width: 135px; height: 135px; }
#about .dakota:hover { background-position: 0 -30px; }
#about .csuf { top: 290px; left: 15px; width: 105px; height: 105px; background: url('../images/about/csuf.png?1302038739') -50px -65px no-repeat; }
#about .csuf:hover { background-position: -75px -20px; }
#about .baby { top: 460px; left: 145px; width: 160px; height: 160px; background: url('../images/about/baby.jpg?1302045484') -60px -70px no-repeat; }
#about .baby:hover { background-position: -10px -20px; }
#about .standards { top: 340px; left: 145px; width: 80px; height: 80px; background: url('../images/about/standards.jpg?1302044850') -10px -40px no-repeat; }
#about .standards:hover { background-position: -60px -170px; }
#about .tables { top: 72px; left: 250px; width: 102px; height: 102px; background: url('../images/about/tables.jpg?1302038743') -6px -7px no-repeat; }
#about .tables:hover { background-position: -8px -25px; }
#about .active-dot { opacity: 1; height: 220px; width: 220px; top: 185px; left: 90px; z-index: 20; background-position: 50% 0%; }

/* skills */
.skills .slider { left: -960px; }
.skills #me { left: 3.5%; }
.skills nav { top: 0px; }

#skills { position: relative; z-index: 300; width: 960px; height: 650px; float: left; }
#skills h3 { font-size: 70px; color: #eeeeee; text-transform: uppercase; position: absolute; left: 250px; top: 310px; opacity: 0; font-family: "quatro-1", "quatro-2", "Arial Black", sans-serif; -webkit-animation: iconFadeIn 2s 1 normal 3s; -webkit-animation-fill-mode: both; }

@-webkit-keyframes iconFadeIn { 0% { opacity: 0; }
  100% { opacity: 1; } }

.skill-marker { position: absolute; top: 245px; left: 225px; border-right: 15px solid transparent; border-left: 15px solid transparent; border-bottom: 15px solid rgba(0, 0, 0, 0.6); display: none; -moz-transition-property: all; -webkit-transition-property: all; -o-transition-property: all; transition-property: all; -moz-transition-duration: 400ms; -webkit-transition-duration: 400ms; -o-transition-duration: 400ms; transition-duration: 400ms; -moz-transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000); -webkit-transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000); -o-transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000); transition-timing-function: cubic-bezier(0.390, 0.575, 0.565, 1.000); -moz-transition-delay: 0; -webkit-transition-delay: 0; -o-transition-delay: 0; transition-delay: 0; }

.skill-descriptions { position: absolute; width: 80%; left: 200px; }
.skill-descriptions li { display: none; position: absolute; top: 260px; width: 90%; padding: 15px; background: rgba(0, 0, 0, 0.6); -moz-border-radius: 12px; -webkit-border-radius: 12px; -o-border-radius: 12px; -ms-border-radius: 12px; -khtml-border-radius: 12px; border-radius: 12px; }
.skill-descriptions h4 { color: white; font-size: 45px; font-family: "quatro-1", "quatro-2", "Arial Black", sans-serif; }
.skill-descriptions p { color: #bbbbbb; font-size: 13px; line-height: 1.5; margin: 15px 0; font-family: "museo-sans-1", "museo-sans-2", sans-serif; }
.skill-descriptions h5 { color: white; font-size: 14px; line-height: 1.8; font-family: "ff-meta-serif-web-pro-1", "ff-meta-serif-web-pro-2", serif; }
.skill-descriptions .skill-mask { overflow: hidden; }
.skill-descriptions .skill-meter { width: 675px; height: 25px; margin: 20px 0; background-image: -webkit-gradient(linear, 0% 50%, 100% 50%, color-stop(0%, #1a1a1a), color-stop(30%, #b0391d), color-stop(100%, #b7d238)); background-image: -moz-linear-gradient(left, #1a1a1a, #b0391d 30%, #b7d238); background-image: linear-gradient(left, #1a1a1a, #b0391d 30%, #b7d238); }
.skill-descriptions .training { width: 270px; }
.skill-descriptions .intermediate { width: 450px; }
.skill-descriptions .master { width: 675px; }

.icons { width: 80%; height: 100px; overflow: hidden; position: absolute; top: 100px; left: 220px; }
.icons li { width: 50px; height: 50px; float: left; margin: 0 35px 0 0; background: url('../images/tools/icons.png?1302038747') no-repeat; position: relative; top: -55px; text-indent: -9999px; cursor: pointer; }
.icons li:hover { top: 2px; }
.icons li:nth-child(2) { background-position: -50px 0; }
.icons li:nth-child(3) { background-position: -100px 0; }
.icons li:nth-child(4) { background-position: -150px 0; }
.icons li:nth-child(5) { background-position: -200px 0; }
.icons li:nth-child(6) { background-position: -250px 0; }
.icons li:nth-child(7) { background-position: -300px 0; }
.icons li:nth-child(8) { background-position: -350px 0; }

.contact #me { left: 3.5%; }
.contact nav { top: 0; }
.contact .slider { left: -1920px; }

#contact { position: relative; z-index: 300; width: 960px; height: 650px; float: left; overflow: hidden; }
#contact h3 { font-size: 38px; text-align: center; margin: 110px 0 0 0; color: rgba(13, 14, 11, 0.7); font-family: "quatro-1", "quatro-2", "Arial Black", sans-serif; }
#contact p { width: 275px; margin: 20px auto; font-size: 20px; line-height: 1.2; color: rgba(13, 14, 11, 0.7); font-family: "ff-meta-serif-web-pro-1", "ff-meta-serif-web-pro-2", serif; }
#contact .star { opacity: 0; width: 31px; height: 31px; background: url('../images/contact/star.png?1302139775') no-repeat; position: absolute; top: 562px; left: 160px; -moz-transform-origin: -50px -50px; -webkit-transform-origin: -50px -50px; -o-transform-origin: -50px -50px; -ms-transform-origin: -50px -50px; transform-origin: -50px -50px; -moz-transform:  scale(0.8, 0.8) rotateZ(45deg); -webkit-transform:  scale(0.8, 0.8) rotateZ(45deg); -o-transform:  scale(0.8, 0.8) rotateZ(45deg); -ms-transform:  scale(0.8, 0.8) rotateZ(45deg); transform:  scale(0.8, 0.8) rotateZ(45deg); }
#contact #paper { width: 345px; height: 440px; position: absolute; left: 350px; top: 110px; background: url('../images/contact/paper.jpg?1302138395') #e1d7b7; }
#contact ul { display: block; width: 200px; margin: 0 auto; }
#contact li { width: 60px; height: 55px; float: left; background: url('../images/contact/contact-icons.png?1302155346') no-repeat; margin-left: 25px; }
#contact li a { display: block; width: 60px; height: 50px; text-indent: -9999px; }
#contact li:first-child { background-position: -60px 0; }

.no-cssanimations #me { -moz-transition-property: all; -webkit-transition-property: all; -o-transition-property: all; transition-property: all; -moz-transition-duration: 500ms; -webkit-transition-duration: 500ms; -o-transition-duration: 500ms; transition-duration: 500ms; -moz-transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); -webkit-transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); -o-transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); transition-timing-function: cubic-bezier(0.250, 0.100, 0.250, 1.000); -moz-transition-delay: 0; -webkit-transition-delay: 0; -o-transition-delay: 0; transition-delay: 0; }
.no-cssanimations #intro h1 { top: 60px; opacity: 1; }
.no-cssanimations #intro p { top: 180px; opacity: 1; }
.no-cssanimations #intro h2 { top: 240px; opacity: 1; text-shadow: 0px 0px 0 #ec5e5e, -0.643px 0.766px 0 #ec5e5e, -1.286px 1.532px 0 #ec5e5e, -1.928px 2.298px 0 #ec5e5e, -2.571px 3.064px 0 #ec5e5e, -3.214px 3.83px 0 #ec5e5e, -3.857px 4.596px 0 #ec5e5e, -4.5px 5.362px 0 #ec5d5d, -5.142px 6.128px 0 #ec5d5d, -5.785px 6.894px 0 #ec5d5d, -6.428px 7.66px 0 #ec5d5d, -7.071px 8.426px 0 #ec5c5c, -7.713px 9.193px 0 #ec5c5c, -8.356px 9.959px 0 #ec5c5c, -8.999px 10.725px 0 #ec5c5c, -9.642px 11.491px 0 #ec5b5b, -10.285px 12.257px 0 #ec5b5b, -10.927px 13.023px 0 #ec5b5b, -11.57px 13.789px 0 #ec5a5a, -12.213px 14.555px 0 #eb5a5a, -12.856px 15.321px 0 #eb5959, -13.499px 16.087px 0 #eb5959, -14.141px 16.853px 0 #eb5858, -14.784px 17.619px 0 #eb5858, -15.427px 18.385px 0 #eb5757, -16.07px 19.151px 0 #eb5757, -16.712px 19.917px 0 #eb5656, -17.355px 20.683px 0 #eb5555, -17.998px 21.449px 0 #eb5555, -18.641px 22.215px 0 #eb5454, -19.284px 22.981px 0 #eb5353, -19.926px 23.747px 0 #eb5353, -20.569px 24.513px 0 #eb5252, -21.212px 25.279px 0 #ea5151, -21.855px 26.046px 0 #ea5050, -22.498px 26.812px 0 #ea5050, -23.14px 27.578px 0 #ea4f4f, -23.783px 28.344px 0 #ea4e4e, -24.426px 29.11px 0 #ea4d4d, -25.069px 29.876px 0 #ea4c4c, -25.712px 30.642px 0 #ea4b4b, -26.354px 31.408px 0 #ea4a4a, -26.997px 32.174px 0 #ea4949, -27.64px 32.94px 0 #e94848, -28.283px 33.706px 0 #e94747, -28.925px 34.472px 0 #e94646, -29.568px 35.238px 0 #e94545, -30.211px 36.004px 0 #e94444, -30.854px 36.77px 0 #e94343, -31.497px 37.536px 0 #e94242, -32.139px 38.302px 0 #e94141, -32.782px 39.068px 0 #e84040, -33.425px 39.834px 0 #e83f3f, -34.068px 40.6px 0 #e83d3d, -34.711px 41.366px 0 #e83c3c, -35.353px 42.132px 0 #e83b3b, -35.996px 42.898px 0 #e83a3a, -36.639px 43.665px 0 #e83838, -37.282px 44.431px 0 #e73737, -37.924px 45.197px 0 #e73636, -38.567px 45.963px 0 #e73434, -39.21px 46.729px 0 #e73333, -39.853px 47.495px 0 #e73131, -40.496px 48.261px 0 #e73030, -41.138px 49.027px 0 #e62f2f, -41.781px 49.793px 0 #e62d2d, -42.424px 50.559px 0 #e62c2c, -43.067px 51.325px 0 #e62a2a, -43.71px 52.091px 0 #e62828, -44.352px 52.857px 0 #e52727, -44.995px 53.623px 0 #e52525, -45.638px 54.389px 0 #e52424, -46.281px 55.155px 0 #e52222, -46.923px 55.921px 0 #e52020, -47.566px 56.687px 0 #e51f1f, -48.209px 57.453px 0 #e41d1d, -48.852px 58.219px 0 #e41b1b, -49.495px 58.985px 0 #e31b1b, -50.137px 59.751px 0 #e11b1b, -50.78px 60.518px 0 #df1a1a, -51.423px 61.284px 0 #dd1a1a; }
.no-cssanimations .about .slider { left: 0; }
.no-cssanimations #about { display: none; }
.no-cssanimations #about .info { opacity: 1; }
.no-cssanimations #about li { opacity: 1; -moz-transform: scale(1, 1); -webkit-transform: scale(1, 1); -o-transform: scale(1, 1); -ms-transform: scale(1, 1); transform: scale(1, 1); }
.no-cssanimations .skills #skills h3 { opacity: 1; }
.no-cssanimations #contact .star { opacity: 1; background-position: 10px 0; }
.no-cssanimations #contact .star-top-left { top: 130px; left: 350px; }
.no-cssanimations #contact .star-top-right { top: 130px; left: 640px; }
.no-cssanimations #contact .star-bottom-left { top: 500px; left: 350px; }
.no-cssanimations #contact .star-bottom-right { top: 500px; left: 640px; }