/*! Open Sans Light | Apache License 2.0 | fonts.google.com/specimen/Open+Sans */ @font-face { font-family: "Open Sans"; font-display: fallback; font-style: normal; font-weight: 300; src: url("fonts/open-sans-light.eot"); src: local("Open Sans Light"), local("OpenSans-Light"), url("fonts/open-sans-light.eot?#iefix") format("embedded-opentype"), url("fonts/open-sans-light.woff2") format("woff2"), url("fonts/open-sans-light.woff") format("woff"), url("fonts/open-sans-light.ttf") format("truetype"), url("fonts/open-sans-light.svg#OpenSans") format("svg"); } @font-face { font-family: "Open Sans"; font-display: fallback; font-style: normal; font-weight: 400; src: url("fonts/open-sans-regular.eot"); src: local("Open Sans Regular"), local("OpenSans-Regular"), url("fonts/open-sans-regular.eot?#iefix") format("embedded-opentype"), url("fonts/open-sans-regular.woff2") format("woff2"), url("fonts/open-sans-regular.woff") format("woff"), url("fonts/open-sans-regular.ttf") format("truetype"), url("fonts/open-sans-regular.svg#OpenSans") format("svg"); } /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */ html { line-height: 1.15; -webkit-text-size-adjust: 100%; } body { margin: 0; } h1 { font-size: 2em; margin: .67em 0; } hr { box-sizing: content-box; height: 0; overflow: visible; } pre { font-family: monospace, monospace; font-size: 1em; } a { background-color: transparent; } abbr[title] { border-bottom: 0; text-decoration: underline; text-decoration: underline dotted; } b, strong { font-weight: bolder; } code, kbd, samp { font-family: monospace, monospace; font-size: 1em; } small { font-size: 80%; } sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sub { bottom: -0.25em; } sup { top: -0.5em; } img { border-style: none; } button, input, optgroup, select, textarea { font-family: inherit; font-size: 100%; line-height: 1.15; margin: 0; } button, input { overflow: visible; } button, select { text-transform: none; } button, [type="button"], [type="reset"], [type="submit"] { -webkit-appearance: button; } button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner { border-style: none; padding: 0; } button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring { outline: 1px dotted ButtonText; } fieldset { padding: .35em .75em .625em; } legend { box-sizing: border-box; color: inherit; display: table; max-width: 100%; padding: 0; white-space: normal; } progress { vertical-align: baseline; } textarea { overflow: auto; } [type="checkbox"], [type="radio"] { box-sizing: border-box; padding: 0; } [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button { height: auto; } [type="search"] { -webkit-appearance: textfield; outline-offset: -2px; } [type="search"]::-webkit-search-decoration { -webkit-appearance: none; } ::-webkit-file-upload-button { -webkit-appearance: button; font: inherit; } details { display: block; } summary { display: list-item; } template { display: none; } [hidden] { display: none; } /*! JJ CSS */ body { display: table; width: 100%; height: 100%; color: #1a1a1a; font-family: "Open Sans", sans-serif; font-weight: 300; font-size: 24px; line-height: 1.5em; } a { text-decoration: none; border-bottom: 1px dashed transparent; transition: border-color 0.2s linear; -moz-transition: border-color 0.2s linear; -webkit-transition: border-color 0.2s linear; -o-transition: border-color 0.2s linear; } div#home { display: table-cell; vertical-align: middle; width: 100%; height: 100%; margin: 0 auto; padding: 8%; } div#home img#me { float: right; margin: 0 0 6px 12px; padding: 4px; border: 1px solid #dddddd; width: 135px; height: 135px; } div#home h1 { margin: 0 0 20px 0; font-size: 1.5em; font-weight: normal; line-height: 1em; letter-spacing: -0.01em; } div#home h2 { margin: 20px 0; font-size: 1.2em; font-weight: normal; line-height: 1.4em; letter-spacing: -0.01em; } div#home p { margin: 20px 0; font-size: 1em; } div#home sup { vertical-align: middle; font-size: 50%; } @media screen and (max-width: 800px) { body { font-size: 16px; } div#home img#me { width: 70px; height: 70px; padding: 2px; margin: 0 0 6px 6px; } div#home h1 { margin: 0 0 12px 0; } div#home h2 { margin: 12px 0; } div#home p { font-size: 1.1em; line-height: 1.5em; margin: 12px 0; } div#home div#footer div#panda { display: none; } div#home div#footer div#blog, div#home div#footer div#info { width: 50% !important; line-height: 20px !important; } div#home div#footer div#info { font-size: 0.7em !important; } div#home div#footer div#blog { font-size: 0.9em !important; } div#home div#footer div#info span#copyright::after { content: "\A"; white-space: pre; } } div#home a#boston { color: #008349; } div#home a#boston:hover { border-color: #008349; } div#home a#javascript { color: #f48024; } div#home a#javascript:hover { border-color: #f48024; } div#home a#node { color: #6fbc4e; } div#home a#node:hover { border-color: #6fbc4e; } div#home a#react { color: #61dafb; } div#home a#react:hover { border-color: #61dafb; } div#home a#angular { color: #c3002f; } div#home a#angular:hover { border-color: #c3002f; } div#home a#vue { color: #41b883; } div#home a#vue:hover { border-color: #41b883; } div#home a#java { color: #ab6311; } div#home a#java:hover { border-color: #ab6311; } div#home a#cpp { color: #865fc5; } div#home a#cpp:hover { border-color: #865fc5; } div#home a#python { color: #f3bb12; } div#home a#python:hover { border-color: #f3bb12; } div#home a#php { color: #8892bf; } div#home a#php:hover { border-color: #8892bf; } div#home a#ruby { color: #d34135; } div#home a#ruby:hover { border-color: #d34135; } div#home a#infosec { color: #00b81a; } div#home a#infosec:hover { border-color: #00b81a; } div#home a#server { color: #0098ec; } div#home a#server:hover { border-color: #0098ec; } div#home a#server span#serverless { color: #87cef7; margin-left: 0.06em; } div#home a#devops { color: #ff6200; } div#home a#devops:hover { border-color: #ff6200; } div#home a#containerization { color: #c48f49; } div#home a#containerization:hover { border-color: #c48f49; } div#home a#y2k { color: #ffa900; } div#home a#y2k:hover { border-color: #ffa900; } div#home a#y2k span#shh { color: #aaaaaa; } div#home span#fairy { color: #fd5da8; } div#home span#fairy:hover { cursor: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyMCIgaGVpZ2h0PSIyMiIgc3R5bGU9ImZvbnQtc2l6ZToxNnB4Ij48dGV4dCB5PSIxOCI+8J+nmjwvdGV4dD48L3N2Zz4=), default !important; } div#home a#github { color: #7290a4; } div#home a#github:hover { border-color: #7290a4; } div#home a#linkedin { color: #0073b1; } div#home a#linkedin:hover { border-color: #0073b1; } div#home a#facebook { color: #4267b2; } div#home a#facebook:hover { border-color: #4267b2; } div#home a.twitter { color: #00acee; } div#home a.twitter:hover { border-color: #00acee; } div#home a#instagram { color: #a37754; } div#home a#instagram:hover { border-color: #a37754; } div#home a#news-1 { color: #ff1b1b; } div#home a#news-1:hover { border-color: #ff1b1b; } div#home a#news-2 { color: #f78200; } div#home a#news-2:hover { border-color: #f78200; } div#home a#news-3 { color: #ffc30c; } div#home a#news-3:hover { border-color: #ffc30c; } div#home a#news-4 { color: #5ebd3e; } div#home a#news-4:hover { border-color: #5ebd3e; } div#home a#news-5 { color: #009cdf; } div#home a#news-5:hover { border-color: #009cdf; } div#home a#news-6 { color: #3e49bb; } div#home a#news-6:hover { border-color: #3e49bb; } div#home a#news-7 { color: #973999; } div#home a#news-7:hover { border-color: #973999; } div#home a#resume { color: #d54b3d; } div#home a#resume:hover { border-color: #d54b3d; } div#home a#email { color: #de0c0c; } div#home a#email:hover { border-color: #de0c0c; } div#home a#pgp { color: #999999; margin: 0 4px; } div#home a#pgp:hover { border-color: #999999; } div#home a#sms { color: #6fcc01; } div#home a#sms:hover { border-color: #6fcc01; } div#home div#footer { margin: 0; height: 40px; } div#home div#footer div { float: left; vertical-align: middle; line-height: 40px; height: 100%; } div#home div#footer div#blog { width: 40%; text-align: left; font-size: 0.75em; } div#home div#footer div#blog a#wordpress { color: #0087be; } div#home div#footer div#blog a#wordpress:hover { border-color: #0087be; } div#home div#footer div#panda { width: 20%; text-align: center; font-size: 1em; } div#home div#footer div#panda span { text-align: center; width: 12px; } div#home div#footer div#info { width: 40%; font-size: 0.5em; color: #777777; text-align: right; } div#home div#footer div#info a { color: #777777; } div#home div#footer div#info a#source { border-bottom: 1px solid #dddddd; } @keyframes wave { 0% { transform: rotate( 0.0deg); } 10% { transform: rotate(-10.0deg); } 20% { transform: rotate( 12.0deg); } 30% { transform: rotate(-10.0deg); } 40% { transform: rotate( 9.0deg); } 50% { transform: rotate( 0.0deg); } 100% { transform: rotate( 0.0deg); } } div#home h1 span#wave { display: inline-block; margin-left: 2px; animation-name: wave; animation-duration: 2.5s; animation-iteration-count: infinite; transform-origin: 70% 70%; }