html, body, div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary, time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; } body { line-height:1; } article,aside,details,figcaption,figure, footer,header,hgroup,menu,nav,section { display:block; } nav ul { list-style:none; } blockquote, q { quotes:none; } blockquote:before, blockquote:after, q:before, q:after { content:''; content:none; } a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; } ins { background-color:#ff9; color:#000; text-decoration:none; } mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; } del { text-decoration: line-through; } abbr[title], dfn[title] {  cursor:help; } table { border-collapse:collapse; border-spacing:0; } hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; } input, select { vertical-align:middle; }  ::-moz-selection { background: #c30; color: #fff; } ::selection { background: #c30; color: #fff; } body { font: 14px/20px "Malgun Gothic", tahoma, dotum, "Helvetica Neue", helvetica, arial, sans-serif; color: #222; color: rgba(32, 32, 32, .75);  background-color: #333; background-repeat: repeat; background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAoAAAALCAMAAABxsOwqAAAACXBIWXMAAAsTAAALEwEAmpwYAAAABGdBTUEAALGOfPtRkwAAACBjSFJNAAB6JQAAgIMAAPn/AACA6QAAdTAAAOpgAAA6mAAAF2+SX8VGAAAAolBMVEUAAQRRVFlLT1IwNDdXW15cX2RVWF1MUFNcYGMaHiEyNTpQU1gWGh1eYWYOEhVOUlUkKCtJTVBKTlEuMjVMT1RLTlNjZmsHCw46PUJXWl9NUVRZXWBNUFVucnUQFBdaXmFITE9tcXQ7P0JYW2AqLjFCRkkdICVoa3AECAtPUlcRFRhQVFdWWl1WWV5YXF9PU1ZUWFtVWVxTV1pSVVpRVVhSVlmJycI4AAAAa0lEQVQIHQXBAwLDQBQFwBentpFa64/7X60zIK+aF+OFGCQNImd82oAV87fevvr3CjtmdqP3OlvCMbvMVfVxgOnmkTQJkccQv33jTZrnuPWKGC2JWrTXU4yzdLElfEmicrDUgMIkmfjsNPwBY4oOvdfwFZ8AAAAASUVORK5CYII='); margin: 0 auto; width: 800px; padding-top: 50px; } #s_t3 > hr { clear: both; margin: 0; border: 0; height: 0; } img, amp-img { vertical-align: bottom; } dl { margin-bottom: 18px; } dt { margin-bottom: 5px; } dd { margin-bottom: 10px; font-style: italic; } h1, h2, h3, h4, h5, h6, strong { font-weight: bold; } h2 { font-size: 26px; line-height: 40px; padding: 10px 0; letter-spacing: -1px; } h2 a { color: #fff; text-shadow: rgba(170, 170, 170, .75) 0 0 20px; text-decoration: none; } h2 a:hover, h2 a:focus { color: #fff; text-shadow: rgba(170, 170, 170, 1) 0 0 20px; } h2 a:active { text-shadow: rgba(32, 32, 32, .75) 0 0 20px; } h3 { font-size: 18px; font-weight: bold; margin-bottom: 18px; } h4 { margin-bottom: 18px; font-size: 14px; font-weight: bold; text-transform: uppercase; } h4 a { color: #222; color: rgba(32, 32, 32, .75); text-decoration: none; } h4 a:hover, h4 a:focus { color: #222; color: rgba(32, 32, 32, .75); } h4 a:active { color: #222; color: rgba(32, 32, 32, 1); } a { color: #A00808; color: rgba(160, 8, 8, .75); text-decoration: underline; } a:hover, a:focus { color: #A00808; color: rgba(160, 8, 8, 1); } a:active { color: #222; color: rgba(32, 32, 32, 1); } textarea, input { border: none; outline: none; } form .text, form .button, form .submit, form textarea { border-radius: 0; -webkit-appearance: none; } #logo { height: 200px; margin-top: -50px; z-index: 25; position: relative; overflow: hidden; } #logo h1 { font-size: 150px; font-weight: bold; text-transform: uppercase; padding-left: 57px; margin-top: 50px; } #logo h1 a { text-decoration: none; letter-spacing: -4px; display: block; position: relative; white-space: nowrap; font-family: "Helvetica", "Arial", sans-serif;  text-shadow: 0px 2px 3px #000; height: 120px; line-height: 120px; } #logo h1 a:active { color: #A00808; color: rgba(160, 8, 8, .9); } #logo h1 a span { display: block; } #logo h2 { font-size: 36px; line-height: 45px; text-transform: lowercase; font-style: normal; color: #222; color: rgba(32, 32, 32, .5); letter-spacing: 0; position: absolute; top: 62px; right: 10%; text-align: right; text-shadow: none; padding: 0; margin: 0; } #logo:hover h2, #logo:focus h2 { color: #222; color: rgba(32, 32, 32, .75); } #logo:active h2 { color: #222; color: rgba(32, 32, 32, .5); } #logo h2, a, a strong { -webkit-transition: all 0.25s linear; -moz-transition: all 0.25s linear; transition: all 0.25s linear; } .version { position: absolute; top: 93px; right: 1%; font-size: 12px; color: #aaa; margin: 0; z-index: 25; } #content { position: absolute; z-index: 25; margin-left: 50px; margin-top: -86px; max-width: 1390px; background-color: #222; background-color: rgba(32, 32, 32, .5); border: 1px solid rgb(0,0,0); border: 1px solid rgba(0,0,0,.5); border-right: none; box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3); }  #day { position: absolute; top: 0; right: 0; left: -50px; font-weight: bold; color: #aaa; color: rgba(170, 170, 170, .75); line-height: 34px; z-index: -5; text-transform: uppercase; letter-spacing: 1px; } #day h3 { width: 50px; font-size: 14px; padding-left: 10px; margin-bottom: 10px; } #day li { color: #aaa; color: rgba(170, 170, 170, .75); margin: 0; list-style: none; font-size: 18px; text-indent: 10px; margin-left: -40%; padding-left: 40%; line-height: 2; } #day a { display: block; color: #222; color: rgba(32, 32, 32, .75); text-decoration: none; margin-left: -40%; padding-left: 40%; -webkit-text-size-adjust: none; } #day a:hover, #day a:focus { background-color: #222; background-color: rgba(32, 32, 32, .75); } #day a:active, #day li.current a:active { background-color: #222; background-color: rgba(32, 32, 32, .75); } #day li.current { background-color: #222; background-color: rgba(32, 32, 32, .50); } #day li.current a { color: #fff; color: rgba(255, 255, 255, 1); } #day li a { color: #fff; color: rgba(255, 255, 255, .75); } #day li a:hover, #day li a:focus { color: #A00808; color: rgba(160, 8, 8, 1); } #day li.sun { color: #A00808; color: rgba(160, 8, 8, .75); } #day li.sun a { color: #A00808; color: rgba(160, 8, 8, 1); } #day li.today { background-color: #fff; background-color: rgba(255, 255, 255, .25); }  #month { position: absolute; top: -45px; left: -40px; color: #aaa; color: rgba(170, 170, 170, .75); text-transform: uppercase; letter-spacing: 1px; font-weight: bold; z-index: 50; } #month h3 { font-size: 14px; float: left; margin-right: 10px; } #month a { color: rgb(255, 255, 255); color: rgba(255, 255, 255, .75); text-decoration: none; }  #year { display: block; position: absolute; top: -120px; right: 0; left: -50px; bottom: -200px; overflow: hidden; font-weight: bold; text-align: center; color: #aaa; color: rgba(170, 170, 170, .75); line-height: 30px; z-index: -10; padding-left: 60px; text-transform: uppercase; letter-spacing: 1px; } #year h3 { font-size: 14px; width: 60px; padding: 20px 0; position: absolute; left: 0; top: 0; } #year ul { width: 5000px; } #year ul li { float: left; width: 60px; list-style: none; padding-top: 20px; color: #aaa; color: rgba(170, 170, 170, .75); margin: 0; } #year ul li span { display: block; width: 60px; padding-top: 20px; position: absolute; top: 0; z-index: 5; bottom: 0; } #year ul li span a { color: #fff; color: rgba(255, 255, 255, .75); text-decoration: none; display: block; width: 60px; } #year ul li.current span { background-color: #222; background-color: rgba(32, 32, 32, .50); color: #fff; color: rgba(255, 255, 255, 1); } #year ul li.current span:hover { color: #A00808; color: rgba(160, 8, 8, 1); } #year ul li.current span a:focus {} #year span:hover { background-color: #222; background-color: rgba(32, 32, 32, .1); } #year a:focus {} #year a:active, #year ul li.current span a:active { background-color: #222; background-color: rgba(32, 32, 32, .35); } body.entries #author h2 { padding-left: 0; } body.archive #navigation #nav-home a, body.post #navigation #nav-home a, body.page #navigation #nav-home a, body.home #navigation #nav-home a, body.author #navigation #nav-author a, body.search #navigation #nav-archives a, body.tag #navigation #nav-archives a, body.labs #navigation #nav-labs a, body.projects #navigation #nav-projects a, body.entries #navigation #nav-archives a { background-color: #fff; background-color: rgba(255, 255, 255, .75); color: #222; color: rgba(32, 32, 32, .5); } body.archive #navigation #nav-home a:hover, body.archive #navigation #nav-home a:focus, body.post #navigation #nav-home a:hover, body.post #navigation #nav-home a:focus, body.home #navigation #nav-home a:hover, body.home #navigation #nav-home a:focus, body.page #navigation #nav-home a:hover, body.page #navigation #nav-home a:focus, body.tag #navigation #nav-archives a:hover, body.tag #navigation #nav-archives a:focus, body.search #navigation #nav-archives a:hover, body.search #navigation #nav-archives a:focus, body.labs #navigation #nav-labs a:hover, body.labs #navigation #nav-labs a:focus, body.porjects #navigation #nav-porjects a:hover, body.porjects #navigation #nav-porjects a:focus, body.author #navigation #nav-authors a:hover, body.author #navigation #nav-authors a:focus, body.entries #navigation #nav-archives a:hover, body.entries #navigation #nav-archives a:focus { color: rgb(32, 32, 32); color: rgba(32, 32, 32, .75); }  #navigation { z-index: 50; position: relative; height: 55px; padding: 42px 0 25px; overflow: hidden; margin-bottom: 0; } #navigation li { float: left; list-style: none; } #navigation li a { float: left; margin-right: 10px; background: #aaa; background: rgba(170, 170, 170, .75); color: #fff; color: rgba(255, 255, 255, .75); text-decoration: none; font-size: 18px; font-weight: bold; text-transform: uppercase; line-height: 33px; padding: 1px 10px; } #navigation li.disabled a { cursor: default; background-color: rgba(32, 32, 32, .75); color: rgba(170, 170, 170, .75); } #navigation li a:hover, #navigation li a:focus { background-color: #aaa; color: #fff; } #navigation li a:active { padding: 2px 10px 0; box-shadow: 0 0 10px rgba(170, 170, 170, .75); } .nav-trigger { display: none; } #pagination { padding: 10px 0 50px; display: block; clear: both; } #pagination p { margin-bottom: 10px; } #pagination .blackout { background: #aaa; background: rgba(170, 170, 170, .75); color: #aaa; color: rgba(255, 255, 255, .75); padding: 4px 10px 8px 50px; font-weight: bold; line-height: 33px; font-size: 18px; } #pagination .blackout a { color: #fff; text-decoration: none; } #pagination .blackout:hover, #pagination .blackout:focus { background-color: #aaa; } #pagination .blackout:active { box-shadow: 0 0 10px rgba(170, 170, 170, .75); } #pagination h3 { display: none; } li#nav-home a, li#nav-home a:active { padding-left: 50px; }  li#search { float: right; position: relative; } li#search input { float: left; height: 35px; padding: 0 10px; text-shadow: #ddd 0 0 0; } li#search input.text { background-color: #fff; background-color: rgba(255, 255, 255, .75); color: #222; color: rgba(32, 32, 32, .5); box-sizing: initial; width: 180px; font: 14px/15px "Helvetica Neue", Helvetica, Arial, sans-serif; } li#search input.text:hover { color: #222; color: rgba(32, 32, 32, .75); } li#search input.text:active, li#search input.text:focus { background-color: #fff; background-color: rgba(255, 255, 255, 1); color: #222; color: rgba(32, 32, 32, .75); } li#search input.submit { background: #aaa; background: rgba(170, 170, 170, .75); color: #fff; color: rgba(255, 255, 255, .75); font: bold 18px/33px "Helvetica Neue", Helvetica, Arial, sans-serif; text-transform: uppercase; padding: 1px 0; width: 60px; cursor: pointer; } li#search input.submit:hover, li#search input.submit:focus { background: #aaa; background: rgba(170, 170, 170, 1); color: #fff; color: rgba(255, 255, 255, 1); } li#search input.submit:active { padding: 2px 0 0; box-shadow: 0 0 10px rgba(170, 170, 170, .75); } li#search #reset { display: none; position: absolute; top: 8px; right: 60px; font-size: 8px; line-height: 20px; border-radius: 10px; padding: 0 8px; cursor: pointer; background-color: #222; background-color: rgba(32, 32, 32, .75); } li#search #reset.active { display: block; }  #breadcrumb { list-style: none; } #breadcrumb li { color: #999; display: inline-block; } #breadcrumb li:not(:last-child):after { content: '>'; } #breadcrumb li a { text-decoration: none; } body.tag #breadcrumb, body.labs #breadcrumb, body.search #breadcrumb, body.projects #breadcrumb, body.not-found #breadcrumb, body.entries #breadcrumb { width: 720px; overflow: hidden; font-size: 28px; margin-top: -11px; margin-bottom: 13px; float: left; line-height: 40px; padding: 0 0 10px 30px; letter-spacing: -1px; } body.tag #breadcrumb li a, body.labs #breadcrumb li a, body.search #breadcrumb li a, body.projects #breadcrumb li a, body.not-found #breadcrumb li a, body.entries #breadcrumb li a { color: #fff; font-weight: bold; text-shadow: rgba(170, 170, 170, .75) 0 0 20px; text-shadow: rgba(170, 170, 170, .75) 0 0 20px; } body.author #breadcrumb, body.page #breadcrumb, body.archive #breadcrumb, body.post #breadcrumb { position: absolute; top: 12px; right: 10px; z-index: 100; } body.author #breadcrumb a, body.page #breadcrumb a, body.archive #breadcrumb a, body.post #breadcrumb a { color: #999; } body.author #breadcrumb a:active, body.author #breadcrumb a:hover, body.page #breadcrumb a:active, body.page #breadcrumb a:hover, body.archive #breadcrumb a:active, body.archive #breadcrumb a:hover, body.post #breadcrumb a:active, body.post #breadcrumb a:hover { color: #fff; text-decoration: underline; }  #author { clear: left; width: 640px; max-width: 640px; margin: 0 20px 30px 20px; padding: 10px 20px; background-color: #A00808; background-color: rgba(160, 8, 8, .50); color: #fff; color: rgba(255, 255, 255, .75); } #author .photo { margin-right: -40px; height: 100px; width: 100px; float: right; background-color: #fff; background-color: rgba(255, 255, 255, .75); border: 5px solid #fff; border: 5px solid rgba(255, 255, 255, .75); } #author h2 { float: left; width: 100%; padding: 0; margin: 10px 0; display: block; font-size: 24px; } #author a { color: #fff; color: rgba(255, 255, 255, .75); font-weight: bold; } #author p { padding-right: 100px; } #author p.more { margin: 20px 0 0; } #author p.more a { text-decoration: none; display: block; padding: 5px 10px; background-color: #222; background-color: rgba(32, 32, 32, .75); color: #fff; color: rgba(255, 255, 255, .75); font-weight: bold; text-align: center; } #author p.more a:hover, #author p.more a:focus { color: #fff; color: rgba(255, 255, 255, 1); text-decoration: underline; } .banner { display: none; }  #footer { color: #fff; color: rgba(255, 255, 255, .75); text-transform: uppercase; padding: 20px 0 20px 10px; font-size: 13px; width: 716px; font-weight: bold; margin: 0; z-index: 25; position: absolute; bottom: -200px; } #footer strong { color: #222; color: rgba(32, 32, 32, .75); } #footer a { text-decoration: none; display: inline-block; padding: 2px 4px 0; background: #aaa; background: rgba(170, 170, 170, .75); } #footer li { display: inline-block; white-space: nowrap; margin: 0; margin-bottom: 5px; } #footer li.copyright { white-space: normal; } #footer li.copyright em { font-style: normal; } #sotial { margin-bottom: 0; } #unnecessary { position: absolute; top: -120px; bottom: -200px; left: -100%; right: 0; z-index: -75; box-shadow: inset 0 25px 75px rgba(0, 0, 0, .25); } amp-img.grayscale, amp-img.gray, img.grayscale, img.gray { -webkit-filter: grayscale(100%); -moz-filter: grayscale(100%); -ms-filter: grayscale(100%); -o-filter: grayscale(100%); filter: grayscale(100%); } amp-img.grayscale:hover, img.grayscale:hover { -webkit-filter: grayscale(0); -moz-filter: grayscale(0); -ms-filter: grayscale(0); -o-filter: grayscale(0); filter: grayscale(0); } body .cf_alert_div { position: absolute; }
body h2.not-found { float: none; color: #fff; text-shadow: rgba(170, 170, 170, .75) 0 0 20px; padding-left: 30px; font-size: 38px; } #not-found { background-color: #222; color: #fff; color: rgba(255, 255, 255, .5); background-color: rgba(32, 32, 32, .75); text-align: center; height: 550px; padding: 110px 20px; font-size: 20px; margin: 0 20px 20px; float: left; width: 640px; }  .cap1 { font-size: 12px; text-align: center; color: #777; line-height: 15px; margin-bottom: 18px; } .cap1 amp-img, .cap1 img { vertical-align: middle; } .textbox0, .textbox1, .textbox2, .textbox3, .textbox4 { margin: 5px -18px 18px -38px; color: #333; padding: 10px 18px 10px 38px; overflow: hidden; border-top:1px dashed #777; border-bottom:1px dashed #777; background-color: #fff; background-color: rgba(255, 255, 255, .75); font-size: 12px; } p { margin-bottom: 18px; } ol, ul { margin-bottom: 18px; } ol li, ul li { margin-bottom: 9px; } ol li { list-style-type: decimal; } ul li { list-style-type: disc; } article { float: left; margin-bottom: 50px; } code { color: #888; color: rgba(0, 0, 0, .5); background-color: #fff; background-color: rgba(255, 255, 255, .75); display: inline-block; padding: .3em 0; font-family: Monaco, Consolas, "Lucida Console", monospace; border-radius: 3px; line-height: 0.8; } code:before, code:after { letter-spacing: -0.2em; content: "\00a0"; } pre code:before, pre code:after { letter-spacing: 0; content: ""; } pre { display: block; margin-bottom: 18px; background-color: #fff; background-color: rgba(255, 255, 255, .75); padding: 10px; overflow: auto; margin: 5px -18px 18px -38px; padding: 5px; border-top: 1px solid #000; border-bottom: 1px solid #000; overflow: auto; } pre code { background: none; display: inline; border-radius: 0; color: #333; font-size: .9em; font-weight: bold; line-height: 1.8; } table.chart { background-color: #fcfcfc; width: auto; border:1px solid #aaa; margin:5px; position:static; } table.chart > th { background-color: #ddd; padding:2px; } table.chart > td { padding:2px; } table.grid { width: 100%; border-top: 1px solid #aaa; border-bottom: 1px solid #aaa; background: #fff; } table.grid td, .grid th { padding: 5px; border-top: 1px solid #ccc; border-bottom: 1px solid #ccc; text-align: center; } table.grid th { background: #FAFAFA; padding: 3px 5px; } table.grid th small { font-weight: normal; } table.grid.border td, .grid.border th { border-left: 1px solid #ccc; border-right: 1px solid #ccc; } table.grid .tags { background: #FAFAFA; } .image-align { line-height: .01; margin-bottom: 20px; } .image-align.left { float: left; margin: 3px 7px 0 0; } .image-align.right { float: right; margin: 5px 0 0 0; padding-left: 7px; } .image-grid { width: 100%; margin-bottom: 12px; overflow: hidden; } .article .image-grid dd { float: left; margin: 0 4px 4px 0; } .article .image-grid dd img { margin-bottom: 8px; } .article .image-grid dd p { margin-bottom: 0; } .article .image-grid dd:last-child { margin: 0 0 4px; } .hasborder { outline: 1px solid rgba(0, 0, 0, 0.4);} .bdr1 { border: 1px solid gray; } .pad2 { padding: 2px; } .pad4 { padding: 4px; } .pad6 { padding: 6px; } .pad8 { padding: 8px; } .pad10 { padding: 10px; } .pad12 { padding: 12px; } .bgwht { background-color: #fff; } .bgblk { background-color: #000; } .box1 { background: #fff; border: 1px solid #aaa; padding: 10px; text-align: center; } .caption { display: block; font-style: italic; font-size: 90%; margin-top: 5px; } .articlelist li p a { font-weight: bold; text-decoration: none; } p.image amp-img, p.image img { margin-left: -10px; border: 10px solid #fff; border: 10px solid rgba(255, 255, 255, .75); } #articlelist li h3 .published, .meta h2 .published { position: absolute; font-size: 36px; width: 50px; padding: 5px 10px 10px; height: 65px; text-align: center; color: #FFE5EB; color: rgba(228, 229, 235, .75); background-color: #222; background-color: rgba(32, 32, 32, .5);  border: 1px solid #000; border: 1px solid rgba(0,0,0,0.5); box-shadow: 0 2px 6px rgba(0,0,0,0.5), inset 0 1px rgba(255,255,255,0.3), inset 0 10px rgba(255,255,255,0.2), inset 0 10px 20px rgba(255,255,255,0.25), inset 0 -15px 30px rgba(0,0,0,0.3); } #articlelist li h3 .published em, .meta h2 .published em { font-size: 10px; display: block; font-style: normal; background-color: #222; background-color: rgba(32, 32, 32, .5); line-height: 20px; margin-top: 5px; }  .meta { float: left; position: relative; width: 676px; max-width: 676px; margin-left: 20px; } .meta h2 { padding: 0 0 20px 90px; } .meta h2 .published { left: 0; } .meta h2 a { font-size: 24px; } .meta p { margin: 0; float: right; line-height: 40px; font-weight: bold; color: #aaa; color: rgba(170, 170, 170, .75); } .meta p a { color: #FFE5EB; color: rgba(228, 229, 235, .75); margin-top: 10px; } .meta p a:hover, .meta p a:focus { color: #FFE5EB; color: rgba(228, 229, 235, 1); }  .tabs { height: 40px; float: left; margin: 0 0 0 90px; line-height: 38px; overflow: hidden; } .tabs li { float: left; margin: 0 10px 0 0; list-style: none; } .tabs li a { color: #222; color: rgba(32, 32, 32, .75); background-color: #aaa; background-color: rgba(170, 170, 170, .75); float: left; padding: 1px 20px; font-weight: bold; text-transform: uppercase; text-decoration: none; letter-spacing: 1px; } .tabs li a:hover, .tabs li a:focus { color: #222; color: rgba(32, 32, 32, 1); } .tabs li a:focus strong, .tabs li a:hover strong { background-color: #222; background-color: rgba(32, 32, 32, 1); display: inline; } .tabs li a:active { padding: 2px 20px 0; } .tabs li a strong { line-height: 20px; margin: 9px -5px 0 5px; padding: 0 10px; border-radius: 10px; background-color: #222; background-color: rgba(32, 32, 32, .75); color: #FFE5EB; color: rgba(228, 229, 235, .75); display: none; } .tabs li a strong.newreaction { background-color: #A00808; background-color: rgba(160, 8, 8, .75); } .tabs li a:focus strong.newreaction, .tabs li a:hover strong.newreaction { background-color: rgba(160, 8, 8, 1); } .tabs li.selected a, .tab-article ul li.goto-article a, .tab-newcomment ul li.goto-comments a, .tab-comments ul li.goto-comments a { background-color: rgb(255, 255, 255); background-color: rgba(255, 255, 255, .85); color: rgb(160, 8, 8); color: rgba(160, 8, 8, .75); } ul li.goto-comments a strong, .tabs li.selected a strong { display: inline; } .tabs li.disabled a:hover strong { display: none; } .tabs li.disabled a { cursor: default; background-color: rgba(32, 32, 32, .75); color: rgba(170, 170, 170, .75); } body.js .tab-article .article, body.js .tab-newcomment .comments, body.js .tab-comments .comments { display: block; } .tabs li.selected a:hover, .tabs li.selected a:focus, .tab-comments li.goto-comments a:hover, .tab-comments li.goto-comments a:focus, .tab-newcomment li.goto-comments a:hover, .tab-newcomment li.goto-comments a:focus, .tab-article li.goto-article a:hover, .tab-article li.goto-article a:focus { color: #A00808; color: rgba(160, 8, 8, 1); } #articletabs { width: 720px; margin-left: 30px; }  #articlelist { background-color: #fff; background-color: rgba(255, 255, 255, .85); margin: 0 0 30px 20px; padding: 0 18px 10px; width: 640px; max-width: 640px; min-height: 580px; float: left; } #articlelist li { border-bottom: 2px solid #aaa; border-bottom: 2px solid rgba(170, 170, 170, .75); list-style: none; padding: 20px 80px 2px 90px; } #articlelist li:last-child { border: none; } #articlelist li .snippet-preview { margin-right: -120px; height: 100px; overflow: hidden; width: 100px; float: right; background-color: #fff; background-color: rgba(255,255,255, .75); border: 5px solid #fff; border: 5px solid rgba(255,255,255, .75); } #articlelist li .snippet-preview.hide { display: none; } #articlelist li .description { color: #000; color: rgba(0, 0, 0, 0.75); height: 60px; line-height: 20px; overflow: hidden; } #articlelist li .actions { clear: left; } #articlelist li h3 { position: relative; } #articlelist li h3 a { text-decoration: none; } #articlelist li.private h3 .published:before { content: "Private"; margin-left: 2px; background-color: #444; background-color: rgba(32, 32, 32, .75); } #articlelist li.unpublished h3 .published:before { content: "Unpublished"; margin-left: -12px; background-color: #222; background-color: rgba(32, 32, 32, .5); } #articlelist li.newreaction h3 .published:before { content: "New reply"; margin-left: -8px; background-color: #A00808; background-color: rgba(160, 8, 8, .75); } #articlelist li.private h3 .published:before, #articlelist li.unpublished h3 .published:before, #articlelist li.newreaction h3 .published:before { position: absolute; bottom: -30px; display: block; font-size: 11px; padding: 4px 5px; border-radius: 3px; line-height: 11px; } #articlelist li h3 .published { left: -90px; line-height: 40px; }  .article, .comments { background-color: #fff; background-color: rgba(255, 255, 255, .85); margin-right: 0; min-height: 220px; float: left; margin-left: 20px; } body.home .comments, body.page .comments, body.archive .comments, body.js .article, body.js .comments { display: none; } .article { padding: 24px 18px 0; width: 640px; max-width: 640px; line-height: 1.6em; text-align: justify; position: relative; font-size: 11pt; font-family: "Apple SD Gothic Neo", "Malgun Gothic", dotum, arial, sans-serif; } .article blockquote { background : #fff; background : rgba(255, 255, 255, 0.75); border-left : 10px solid #aaa; padding : 15px 10px 15px 18px; margin-bottom: 18px; } .article blockquote h3 { margin: 0 -10px 8px -28px; } .article blockquote p:last-child { margin-bottom : 0; } .article figure.image-align { margin-bottom: 18px; } .article table, .article iframe, .article object, .article embed, .article img { max-width: 100%; } .article img { height: auto; } .article p.note { color: #222; color: rgba(32, 32, 32, .5); font-style: italic; } .article table { margin-bottom: 1em; } .article table.procon th { width: 50%; } .article table th { padding: 1em 0.5em; text-align: left; color: #fff; color: rgba(255, 255, 255, .75); background-color: #222; background-color: rgba(32, 32, 32, .5); } .article table td {  padding: 0.5em; vertical-align: top; } .article dl dt { font-weight: bold; } .article dl dd { margin-left: 2em; } .article samp, .article kbd { color: #A00808; color: rgba(160, 8, 8, .75); background-color: #fff; background-color: rgba(255, 255, 255, .75); padding: 3px 5px; font: bold 13px/18px "Courier New", Courier, mono; } .article h3 { font-size: 1.3em; background-color: #fff; background-color: rgba(255, 255, 255, .5); padding: 18px 38px; margin: 12px -18px 18px -38px; clear: both; } .article h3 em { float: right; font-weight: normal; font-style: italic; margin-right: -16px; font-size: smaller; } .article h4 { font-size: 1.3em; border-bottom: 1px solid #bbb; padding: 8px 18px; margin: 12px -18px 18px -18px; clear: both; } .article h4 a { color: #A00808; color: rgba(160, 8, 8, 1); text-decoration: underline; } .article h5 { font-size: 1.2em; margin: 12px 0; clear: both; } .article h6 { font-size: 1.2em; margin: 12px 0; clear: both; } .article li { margin-left: 30px; margin-bottom: 4px; } .article ul li { list-style: disc; } .article ol li { list-style: decimal; } .article li li { margin-left: 1em; } ul.square > li { list-style: square; } ul.disc > li { list-style: disc; } ul.circle > li { list-style: circle; } ul.number > li { list-style: decimal; margin-left: 30px; } .article ul ul { margin: 5px 0 10px 20px; color: #222; color: rgba(32, 32, 32, .6); } .article ul ul li { list-style: circle; }  .article .domore { background-color: #A00808; background-color: rgba(160, 8, 8, .75); clear: both; margin: 24px -18px 0 -18px; padding: 10px 10px 18px; line-height: 30px; font-size: 16px; text-align: right; } .article .domore > amp-img, .article .domore > img { visibility: hidden; position: absolute; width: 0; height: 0; } .article .domore h3, .article .domore ul, .article .domore li { margin: 0; padding: 0; background: none; font-weight: normal; font-size: 16px; display: inline; list-style: none; color: #fff; color: rgba(255, 255, 255, .75); } .article .domore a { color: #222; color: rgba(32, 32, 32, .75); text-decoration: none; } .article .domore a:hover, .article .domore a:focus { text-decoration: underline; } .article .domore a:active { color: #222; color: rgba(32, 32, 32, 1); } .article .domore .tags { margin: 10px 0; padding:0; list-style:none; display: block; } .article .domore .tags li, .article .domore .tags a { position:relative; display: inline-block; line-height:24px; font-size:11px; } .article .domore .tags a { text-decoration:none; margin-left:1px; padding:0 10px 0 12px; background:#fff; background:rgba(255,255,255, .75); } .article .domore .tags a:hover{ background: #aaa; background: rgba(170, 170, 170, .75); color: #fff; color: rgba(255, 255, 255, .75); } .article .domore .tags li:last-child { margin-right: 4px; }
#s_t3.loading { opacity: 0.8; }  #owner { position: absolute; top: -64px; right: 4px; z-index: 100; } #owner li { float: left; list-style: none; margin-right: 4px; } #owner li a { opacity: .4; } #owner li a:active, #owner li a:hover { opacity: .8; } .notification { position: absolute; top: 10px; left: 10px; z-index: 100; color: #eee; text-decoration: none; } .article .domore .actions { margin-top: 10px; } .article .domore .actions a { display: inline-block; text-align: center; text-shadow: white 0 0 0; padding: 3px 15px 0; margin-left: 4px; height: 35px; font-weight: bold; font-size: 13px; text-decoration: none; text-transform: uppercase; color: #FFE5EB; color: rgba(228, 229, 235, .75); background-color: #222; background-color: rgba(32, 32, 32, .75); } .article .domore .actions a.disabled { cursor: default; background-color: #aaa; background-color: rgba(170, 170, 170, .75); } .article .domore .actions a:hover, .article .domore .actions a:focus { background-color: #222; background-color: rgba(32, 32, 32, 1); }  .g_container { position: relative; border: 1px solid #ccc; background-color: #fdfdfd; margin: 5px auto 18px auto; padding: 7px; overflow: hidden; max-width: calc(100% - 16px); } .article img.g_motion { max-width: calc(100% - 16px); } .g_nav { position: absolute; z-index: 5; top: 5px; } .g_next, .g_prev { position: absolute; z-index: 6; } .g_next { right: 17px; } .g_prev { left: 17px; } .g_pannel { position: absolute; left: 17px; top: 17px; width: 150px; height: 25px; z-index: 7; } .g_count { background: #666; border-radius: 3px;  font: 13px/15px bold Thoma, Arial Black, verdana; color: #fff; padding-top: 3px; width: 70px; height: 20px; text-align: center; float: left; margin-right: 5px; } .g_motion { position: absolute; left: 7px; top: 7px; z-index: 1; }  .comments { padding: 36px 28px 18px; width: 620px; } .comments h3 { display: none; } .comments .hidden { color: red; } .comments .disclaimer { color: #A00808; color: rgba(160, 8, 8, .75); } .comments blockquote { margin-left: 2em; font-style: italic; } .comments li { list-style: none; padding: 0 80px; margin: 0; font-size: 12px; line-height: 20px; clear: both; color: #888; position: relative; } .comments li p.description { padding: 18px 20px; margin-bottom: 8px; font-size: 13px; word-break: break-all; background: #fff; background: rgba(255, 255, 255, .75); } .comments li p.description:before { content: ''; font-size: 0; line-height: 0%; width: 0; height: 0; position: absolute; top: 46px; border-top: 5px solid transparent; border-bottom: 5px solid transparent; } .comments li.odd p.description:before { border-right: 10px solid #fff; border-right: 10px solid rgba(255, 255, 255, .75); left: 70px; } .comments li.even p.description:before { border-left: 10px solid #fff; border-left: 10px solid rgba(255, 255, 255, 0.75); right: 70px; } .comments li p.permlink { float: right; margin: 0; } .comments li h4 { white-space: nowrap; overflow: hidden; margin-bottom: 2px; } .comments li h4 amp-img, .comments li h4 img { position: absolute; left: 0; top: 21px; opacity: .9; border: 5px solid #fff; border: 5px solid rgba(255, 255, 255, .75); -webkit-transition: opacity 0.1s linear; } .comments li p.actions { clear: both; } .comments li h4 amp-img:hover, .comments li h4 img:hover, .comments li h4 a:hover amp-img, .comments li h4 a:hover img { opacity: 1; } .comments li.even p.permlink { float: left; } .comments li.even p.actions, .comments li.even h4 { text-align: right; } .comments li.even h4 a { float: right; } .comments li.even h4 amp-img, .comments li.even h4 img { left: auto; right: 0; } .comments li h4 a small, .comments li p.permlink a { color: #aaa; color: rgba(170, 170, 170, .75); font-weight: normal; text-decoration: none; -webkit-transition: color 0.1s linear; } .comments li h4 a:hover small, .comments li h4 a:active small, .comments li p.permlink a:hover, .comments li p.permlink a:focus { color: #222; color: rgba(32, 32, 32, .75); } .comments li h4 a:active small, .comments li p.permlink a:active { color: #222; color: rgba(32, 32, 32, 1); }  .comments .form .reply { position: relative; } .comments .form .reply p { line-height: 1; margin-bottom: 4px; } .comments .form .reply p.buttons { margin-bottom: 18px; } .comments .form .reply label { width: 48px; display: inline-block; vertical-align: middle; } .comments .form .reply .avatar { position: absolute; right: 0; border: 4px solid #fff; border: 4px solid rgba(255, 255, 255, .75); } .comments .form .reply textarea { width: 99.2%; }  .newcomment { clear: both; margin-top: 40px; position: relative; } .newcomment h3 { background-color: #fff; background-color: rgba(255, 255, 255, .75); white-space: nowrap; display: block; padding: 18px 40px 18px 160px; margin: 0 -28px 18px -48px; } .newcomment .avatar { position: absolute; right: 440px; top: 300px; border: 5px solid #fff; border: 5px solid rgba(255, 255, 255, .75); } .newcomment form p { height: 35px; margin-bottom: 10px; text-align: right; line-height: 25px; } .newcomment form p input, .newcomment form p textarea { font: 14px/15px "Helvetica Neue", Helvetica, Arial, sans-serif; width: 400px; padding: 10px 10px 5px; height: 15px; text-shadow: #fff 0 0 0; background: #fff; background: rgba(255, 255, 255, .75); } .newcomment form p input:focus, .newcomment form p textarea:focus { background: #fff; background: rgba(255, 255, 255, 1); } .newcomment form p label { float: left; width: 100px; font-weight: bold; position: absolute; text-transform: uppercase; line-height: 35px; right: 440px; } .newcomment form p label:hover { color: #222; color: rgba(32, 32, 32, 1); } .newcomment form p.captcha img { position: absolute; top: 126px; right: 365px; display: block; } .newcomment form p.captcha input { text-indent: 55px; } .newcomment form p.optional label { color: #aaa; color: rgba(170, 170, 170, .75); } .newcomment form p.optional label:hover { color: #aaa; color: rgba(170, 170, 170, 1); } .newcomment form p textarea { height: 180px; resize: none; } .newcomment form p.textarea { height: 200px; } .newcomment p.disclaimer { padding: 10px 0 0 120px; text-align: left; line-height: 35px; color: #aaa; color: rgba(170, 170, 170, .75); } .newcomment p.buttonbar { line-height: 33px; margin-top: -45px; height: 35px; float: right; } .newcomment p.buttonbar input { width: 100px; float: left; padding: 1px 0; height: 35px; margin-left: 20px; font-weight: bold; text-transform: uppercase; cursor: pointer; color: #FFE5EB; color: rgba(228, 229, 235, .75); background-color: #222; background-color: rgba(32, 32, 32, .75); } .newcomment p.buttonbar input:hover, .newcomment p.buttonbar input:focus { background-color: #222; background-color: rgba(32, 32, 32, 1); } .newcomment p.buttonbar input:active { color: #FFE5EB; color: rgba(228, 229, 235, 1); padding: 2px 0 0; } .newcomment p.buttonbar input.disabled { background-color: #aaa; background-color: rgba(170, 170, 170, .75); cursor: default; }  @media only screen and (min-device-width: 375px) and (max-device-width: 667px) { body.mobile { background-size: 15px 16px; } body.mobile #navigation { -webkit-text-size-adjust: 110%; height: 60px;} body.mobile #navigation #search input.text { padding: 4px 10px; height: 30px; } body.mobile #navigation #search input.submit { height: 38px; line-height: 25px; } body.mobile .comments .description, body.mobile #articlelist .description, body.mobile .article { font-size: 21px; } body.mobile .comments .description { line-height: 1.3; font-size: 18px; } body.mobile #articlelist .description { line-height: 1.5; } body.mobile #pagination, body.mobile article h2 a, body.mobile .tabs li a, body.mobile .article .domore, body.mobile .comments, body.mobile #articlelist h3 a, body.mobile #articlelist .actions { -webkit-text-size-adjust: 120%; } body.mobile.tag #breadcrumb, body.mobile.search #breadcrumb, body.mobile.labs #breadcrumb, body.mobile.projects #breadcrumb, body.mobile.not-found #breadcrumb, body.mobile.entries #breadcrumb { margin: 0 0 2px 10px; font-size: 28px; padding: 0 0 10px 30px; width: 83.6vw; } body.mobile #navigation li:first-child a { padding-left: 50px; } body.mobile #articlelist li .description { height: 72px; font-size: 1.2em; line-height: 1.3; } body.mobile #articlelist .actions { margin-right: -80px; } body.mobile #logo { width: 100%; } body.mobile #footer { font-size: inherit; } body.mobile #not-found { } body.mobile #swipe-right, body.mobile #swipe-left { display: none; } body.swipe #swipe-right, body.swipe #swipe-left { font-size: 120px; font-weight: bold; display: block; text-align: center; position: fixed; top: 26%; z-index: 1000; border-radius: 20px; width: 128px; height: 128px; line-height: 120px; letter-spacing: -5px; background: rgba(0, 0, 0, 0.7); color: rgba(255, 255, 255, 0.8); } body.swipe #swipe-right { left: -128px; } body.swipe #swipe-right:before { content: "⇠"; } body.swipe #swipe-left { right: -128px; } body.swipe #swipe-left:before { content: "⇢"; } body.mobile #content article { margin-bottom: 50px; } @media screen and (orientation: portrait) { body.mobile .article, body.mobile .comments, body.mobile #articlelist, body.mobile #author { width: 83.6vw; } } @media screen and (orientation: landscape) { body.mobile #logo { font-size: 180px; margin-left: 50px; } body.mobile #content { margin-left: 50px; } body.mobile #articlelist li .snippet-preview { margin-right: -117px; } body.mobile #author { position: absolute; width: 190px; top: 227px; left: 697px; display: block; z-index: 1; padding-right: 20px; } body.mobile #author img { margin-right: 80px; margin-top: -180px; } body.mobile #author p { padding-right: 0;} body.mobile #author h2 { margin-top: 80px; } } }  .heatmap { position: absolute; top:0; left:0; right: 0; width: 100%; overflow: hidden; background-color: #EBEBF0; opacity: .5; z-index: 100; line-height: normal; } .heatmap img { margin-bottom: -4px; } .heatmap div { background-position: center center; min-width: 702px; height: 1000px; background-repeat: no-repeat; }  .humanized-msg { position: fixed; left: 23%; width: 60%; border-radius: 20px; color: white; background-color: #222; background-color: rgba(32, 32, 32, .75); font-size: 22pt; text-align: center; font-weight: bold; z-index: 1000; letter-spacing: -2px; top: 32% !important; opacity: 1 !important; } .humanized-msg p { margin: 10px 20px 18px; line-height: 36px; } .tracker { position: fixed; cursor: pointer; right: 0; top: 0; line-height: 1.3; width: auto; text-align: right; color: #fff; opacity: 0.8; } .tracker span { background-color: #c30; padding: 2px 3px; } .tracker { position: fixed; cursor: pointer; right: 0; top: 0; line-height: 1.3; width: auto; text-align: right; color: #fff; opacity: 0.8; z-index: 10000000; } .tracker span { background-color: #c30; padding: 2px 3px; } #crosshair { z-index: 9999; margin-bottom: 21px; position: absolute; z-index: 10000000; background: url(data:image/gif;base64,R0lGODlhFQAeAKIHAOubAPPDZu+uM/vrzPfXmf///wAAAP///yH/C05FVFNDQVBFMi4wAwEAAAAh+QQFAAAHACwAAAAAFQAeAAADPni63P4wykmrvTjrDQ03nmYAITaS2Yle6lq17gTH0Uw/9t3k+jKDwBpgeCpJisXXKikrMY87Yko67QmttVACACH5BAUAAAcALAoACwAJABIAAAMfKLe8os29eN5s9srMst1e5Y3fJnaQBknU2WrYGsFoAgAh+QQFAAAHACwKAAsACQASAAADHxi3vKHNvXjebPbKzLLdXuWN3yZ2kAZJ1Nlq2BrBaAIAIfkEBQAABwAsCgALAAkAEgAAAx9It7ykzb143mz2ysyy3V7ljd8mdpAGSdTZatgawWgCACH5BAUAAAcALAoACwAJABIAAAMfOLe8o829eN5s9srMst1e5Y3fJnaQBknU2WrYGsFoAgAh+QQFAAAHACwKAAsACQASAAADH1i3vKXNvXjebPbKzLLdXuWN3yZ2kAZJ1Nlq2BrBaAIAIfkEBQAABwAsCgALAAkAEgAAAx84t7yjzb143mz2ysyy3V7ljd8mdpAGSdTZatgawWgCACH5BAUAAAcALAoACwAJABIAAAMfSLe8pM29eN5s9srMst1e5Y3fJnaQBknU2WrYGsFoAgAh+QQFAAAHACwKAAsACQASAAADHxi3vKHNvXjebPbKzLLdXuWN3yZ2kAZJ1Nlq2BrBaAIAIfkEBQAABwAsCgALAAkAEgAAAx8ot7yizb143mz2ysyy3V7ljd8mdpAGSdTZatgawWgCADs=) no-repeat center; width: 21px; height: 30px; margin: -9px 0 0 -9px; } #crosshair.click { background-image: url(data:image/gif;base64,R0lGODlhFQAeAJEDAOubAAAAAP///////yH5BAEAAAMALAAAAAAVAB4AAAJcnI+pB7C9GETNRTPllXbUzWEd6I1i9kVVWq4Km7hGQEYBXSeBgJPTzvP9BMTeIwMsXjKDpLLmfIKi0gu1urhidcQu73azdoFG8XebDTbRuh6ZVH7nZuyNfH7H4woAOw==); } #minimap { position: fixed; z-index: 100; margin-left: 739px; bottom: 20px; margin-top: auto; background-color: #222; background-color: rgba(32, 32, 32, .5); box-shadow: 0 0 10px rgba(32, 32, 32, .5); border: 1px solid #000; border: 1px solid rgba(0,0,0,0.5); }
@media only screen and (min-device-width: 320px) and (max-device-width: 480px) { body { margin-left: 0; -webkit-text-size-adjust: none; } body #logo h2, body a, body a strong { transition: none; } body .newcomment form .text, body .comments ul .form form .text { font-size: 16px; color: #333; } body .comments ul .form form input.text { padding: 2px 4px; } body .newcomment form p input, .newcomment form p textarea { padding: 8px 10px; } body .article .domore .actions a { padding: 3px 12px 0; }  @media screen and (orientation: portrait) { body .comments ul .form form input.text { width: 45vw; } } @media screen and (orientation: landscape) { body .comments ul .form form input.text { width: 30vw; } } @media screen and (max-width: 480px) { body #navigation li a { padding: 1px 8px; } body #search input.text { width: 120px; } #content .tabs li { line-height: 30px; } #content .tabs { height: 30px; } } }  @media screen and (max-width: 800px) { body { width: auto; } #logo h1 { font-size: 18.7vw; margin-top: 40px; } #logo h2 { font-size: 4.5vw; } #content { width: calc(100% - 51px); } #content article { float: none; overflow: hidden; margin-bottom: 30px; } #content .tabs li a strong { display: none; } #content .tabs li.goto-comments a strong, #content .tabs li.selected a strong { display: inline; } #author .photo { margin-right: -33px; } #articlelist li .snippet-preview { margin-right: -115px; } header.meta { width: calc(100% - 38px); } .comments { padding: 36px 20px 18px; } .newcomment h3 { margin: 0 -20px 18px -40px; } .article, .comments, #articlelist, #author, #not-found { width: calc(100% - 74px); min-width: 240px; clear: left; } body.tag #breadcrumb, body.search #breadcrumb, body.labs #breadcrumb, body.projects #breadcrumb, body.not-found #breadcrumb, body.entries #breadcrumb { width: 84vw; } .article { min-height: 100px; } #articletabs { clear: left; width: auto; } nav#pagination .blackout { padding: 8px 10px 8px 20px; } #footer { width: 90vw; font-size: 11px; } #year, #footer { bottom: -210px; } }  @media screen and (max-width: 767px) { .article { font-size: 14px; } #navigation li:first-child a { padding-left: 28px; } } @media screen and (max-width: 640px) { #logo h1 { padding-left: 20px; } #logo h1 a { line-height: 80px; height: 80px; } #month, #day { display: none; } .article, .comments, #articlelist, #author, #not-found { width: calc(100% - 60px); } #content { margin-left: 10px; width: calc(100% - 11px); min-width: 300px; } #content .meta h2 { padding-left: 0; margin-top: 24px; margin-bottom: 0; line-height: 1.2; } #content .meta h2 .published { display: none; } #content .meta .tabs { margin-left: 0; } #content .tabs li { margin-right: 5px; } #content .tabs li a { padding: 1px 12px; } body.tag #breadcrumb, body.search #breadcrumb, body.labs #breadcrumb, body.projects #breadcrumb, body.not-found #breadcrumb, body.entries #breadcrumb { margin: 18px 0 4px 20px; font-size: 24px; padding: 0; width: auto; } #articletabs { margin-left: 20px; } body #articlelist { min-height: 240px; } #not-found { height: 210px; } #author p { padding-right: 0; } #articlelist .snippet-preview { display: none; } #not-found { height: 140px; margin-top: 10px; margin-right: 0; } #year { left: -60px; } #year ul li, #year ul li span { padding-top: 10px; } } @media screen and (max-width: 568px) { #sotial { display: none; } #footer ul { margin-bottom: 0; } #year, #unnecessary, #footer { bottom: -100px; } } @media screen and (max-width: 480px) { body { margin: 0; position: relative; } #logo { height: 114px; } #logo h1 { padding-left: 5px; font-size: 21.2vw; margin-top: 38px; } #logo h1 a { line-height: 70px; height: 70px; overflow: hidden; } #logo h2 { font-size: 6.5vw; top: 50px; } #content { margin-top: 0; } #content > h2 { font-size: 32px; margin-top: 7px; margin-bottom: 10px; } #content .meta { width: 94vw; padding-left: 8px; margin-left: 0; } article .meta h2 { font-size: 6vw; } blockquote { padding-left: 10px; } blockquote h3 { margin-left: -20px; } .article li { margin-left: 20px; } .article, .comments, #articlelist, #author, #not-found { width: calc(100% - 44px); margin-left: 8px; line-height: 1.8; } .notification { top: -24px; left: 4px; } .comments ul li.odd { padding-right: 0; } .comments ul li.even { padding-left: 0; } .comments ul li.form { padding: 0; } .newcomment h3 { margin: 0 -20px 18px; padding-left: 80px; } .newcomment form p input, .newcomment form p textarea { width: 60vw; } .newcomment form p label { right: 67vw; } .newcomment .avatar { right: 67vw; } .newcomment form p.captcha img { right: 51vw; top: 138px; } #author .photo, header.meta p { display: none; } #articletabs { margin-left: 8px; } #articlelist li { padding: 20px 0 2px; margin-bottom: 0; line-height: 1.4; } #articlelist li h3, #articlelist li .description { margin-bottom: 8px; } #articlelist li .published { display: none; } #breadcrumb { display: none; } body.tag #breadcrumb, body.search #breadcrumb, body.labs #breadcrumb, body.projects #breadcrumb, body.not-found #breadcrumb, body.entries #breadcrumb { margin-left: 8px; display: block; } #navigation { padding-top: 20px; } nav#pagination { padding-bottom: 40px; } nav#pagination .blackout { font-size: 13px; padding-left: 15px; } #author, #not-found { margin-right: 0; padding-right: 16px; } #year { left: -254px; } #footer ul li:not(.copyright) { display: none; } #footer li.copyright em { display: none; } #year, #unnecessary, #footer { bottom: -70px; } }  @media only screen and (min-device-width: 320px) and (max-device-width: 480px) and (max-width: 414px) { .nav-trigger-x, .nav-trigger { position: fixed; bottom: 16px; right: 16px; z-index: 100; outline: none; height: 30px; display: block; width: 30px; cursor: pointer; background-color: rgba(255, 255, 255, .3); padding: 4px; } .nav-trigger-x { right: -39px; } .nav-trigger span { position: relative; display: block; margin-top: 0.9em; } .nav-trigger span:before, .nav-trigger span:after { content: " "; position: absolute; top: -10px; box-sizing: border-box; } .nav-trigger span:after { top: 10px; } .nav-trigger span, .nav-trigger span:before, .nav-trigger span:after { background-color: rgba(32, 32, 32, .5); width: 100%; height: 4px; transition: transform 0.2s; } .nav-trigger:focus span { background: transparent; } .nav-trigger:focus span:before { transform: rotate(45deg) translate(7px, 7px); } .nav-trigger:focus span:after { transform: rotate(-45deg) translate(7px, -7px); } .nav-trigger:focus + .nav-trigger-x { right: 16px; } .nav-trigger:focus ~ .menu-wrap #search, .menu-wrap:hover #search, .nav-trigger:focus ~ .menu-wrap #nav-home, .nav-trigger:focus ~ .menu-wrap #nav-archives, .nav-trigger:focus ~ .menu-wrap #nav-labs, .nav-trigger:focus ~ .menu-wrap #nav-projects, .nav-trigger:focus ~ .menu-wrap #nav-author, .nav-trigger:focus ~ .menu-wrap #nav-feed { right: 0; } .menu-wrap { position: fixed; bottom: 300px; right: 0; width: 0; height: 0; padding: 39px 0 0 0; margin: 0; } li#search #reset { right: 65px; } #search { right: -205px; } #nav-home { right: -75px; } #nav-archives { right: -115px; } #nav-labs { right: -70px; } #nav-projects { right: -120px; } #nav-author { right: -100px; } #nav-feed { right: -70px; } body #navigation { overflow: initial; height: 0; margin: 0; padding: 0; } body #navigation li { position: relative; float: right; clear: both; margin-bottom: 4px; transition: right 0.2s; } body #navigation li a { margin: 0; background: rgba(128, 128, 128, .75); } body #navigation li:first-child a { padding-left: 8px; } body #navigation #search { position: absolute; top: 0; width: 200px; } body #navigation #search input.text { font-size: 16px; line-height: 16px; } body #navigation #search .submit { background: rgba(128, 128, 128, .75); } ::-webkit-input-placeholder { line-height: 1.3; } } @media screen and (max-width: 360px) { blockquote { margin-left: -13px; } #footer { font-size: 10px; } .newcomment form p input, .newcomment form p textarea { width: 50vw; } .newcomment form p label { right: 58vw; } .newcomment .avatar { right: 58vw; } .newcomment form p.captcha img { right: 40vw; } } @media screen and (max-width: 320px) { #year { left: -284px; top: -100px; } #logo { height: 94px; } #logo h1 { margin-top: 28px; } .version { top: 73px; } } @media screen and (min-width: 481px) and (max-width: 800px) { #content > h2 { font-size: 32px; margin-top: 7px; } #content .tabs li { margin-right: 8px; } #content .tabs li a { padding: 1px 16px; } .newcomment form p label {right: 430px; } .newcomment .avatar { right: 430px; } nav#pagination .blackout { font-size: 16px; } } @media screen and (min-width: 481px) and (max-width: 640px) { #content #author { margin-right: 15px; } .newcomment form p input, .newcomment form p textarea { width: 300px; } .newcomment a .avatar { right: 330px; } .newcomment form p.captcha img { right: 265px; } #content .newcomment form p label {right: 330px; } #articlelist li { padding: 20px 0 2px 80px; } #author .photo { margin: -30px 0 10px 10px; } nav#pagination .blackout { font-size: 15px; } } @media screen and (min-width: 920px) and (max-width: 1151px) { #logo h1 { font-size: 165px; margin-left: -50px; } #content { margin-left: 0; } } @media screen and (min-width: 1152px) { body { width: 998px; } #logo h1 { font-size: 180px; margin-left: 50px; } #logo h1 a { height: 140px; line-height: 140px; } #content { margin-left: 90px; } #author { position: absolute; width: 190px; top: 222px; left: 700px; display: block; z-index: 1; padding-right: 20px; } #author .photo { margin-right: 80px; margin-top: -180px; } #author p { padding-right: 0;} #author h2 { margin-top: 80px; } canvas#minimap { margin-left: -140px; top: inherit; right: inherit; top: 50%; margin-top: -256px; } }
code[class*="language-"], pre[class*="language-"] { font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; text-align: left; white-space: pre; word-spacing: normal; word-break: normal; word-wrap: normal; line-height: 1.8; -moz-tab-size: 4; -o-tab-size: 4; tab-size: 4; -webkit-hyphens: none; -moz-hyphens: none; -ms-hyphens: none; hyphens: none; }  pre[class*="language-"] { padding: .4em .4em .4em 30px; overflow: auto;  background: repeating-linear-gradient( -45deg, #222, #222 6px, #333 6px, #333 12px ); background: repeating-linear-gradient( -45deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .2) 6px, rgba(0, 0, 0, .2) 6px, rgba(0, 0, 0, .2) 12px ); } code[class*="language-"] { background: black; color: white; box-shadow: -.3em 0 0 .3em black, .3em 0 0 .3em black; }  :not(pre) > code[class*="language-"] { padding: .2em; border-radius: .3em; box-shadow: none; white-space: normal; } .token.comment, .token.prolog, .token.doctype, .token.cdata { color: #aaa; font-style: italic; } .token.punctuation { color: #999; } .namespace { opacity: .7; } .token.property, .token.tag, .token.boolean, .token.number, .token.constant, .token.symbol { color: #0cf; } .token.selector, .token.attr-name, .token.string, .token.char, .token.builtin { color: yellow; } .token.operator, .token.entity, .token.url, .language-css .token.string, .token.variable, .token.inserted { color: yellowgreen; } .token.atrule, .token.attr-value, .token.keyword { color: deeppink; } .token.regex, .token.important { color: orange; } .token.important, .token.bold { font-weight: bold; } .token.italic { font-style: italic; } .token.entity { cursor: help; } .token.deleted { color: red; } .token.function { color: aqua; }





/*
     FILE ARCHIVED ON 11:17:26 May 18, 2018 AND RETRIEVED FROM THE
     AN OPENWAYBACK INSTANCE ON 6:21:48 Sep 24, 2025.
     JAVASCRIPT APPENDED BY OPENWAYBACK, COPYRIGHT INTERNET ARCHIVE.

     ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
     SECTION 108(a)(3)).
*/