*{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
h1{margin:0;}
.btn{display:inline-block;padding:4px 10px 4px;font-size:13px;line-height:18px;color:#333333;text-align:center;text-shadow:0 1px 1px rgba(255, 255, 255, 0.75);background-color:#fafafa;background-image:-webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));background-image:-webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:-moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);background-image:-ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:-o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-image:linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);background-repeat:no-repeat;border:1px solid #ccc;border-bottom-color:#bbb;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;-webkit-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 1px 0 rgba(255, 255, 255, 0.2),0 1px 2px rgba(0, 0, 0, 0.05);cursor:pointer;}.btn:hover{color:#333333;text-decoration:none;background-color:#e6e6e6;background-position:0 -15px;-webkit-transition:background-position 0.1s linear;-moz-transition:background-position 0.1s linear;-ms-transition:background-position 0.1s linear;-o-transition:background-position 0.1s linear;transition:background-position 0.1s linear;}
.btn:focus{outline:thin dotted;outline:5px auto -webkit-focus-ring-color;outline-offset:-2px;}
.btn.active,.btn:active{background-image:none;-webkit-box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);-moz-box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.15),0 1px 2px rgba(0, 0, 0, 0.05);background-color:#e6e6e6;background-color:#d9d9d9 \9;color:rgba(0, 0, 0, 0.5);outline:0;}
body{background:#929292;font-family:"Helvetica Neue",Arial,sans-serif;text-align:center;}
section{width:1024px;height:768px;position:absolute;top:50%;left:50%;margin-left:-512px;margin-top:-384px;border-radius:8px;-o-border-radius:8px;-moz-border-radius:8px;-webkit-border-radius:8px;background:white;-moz-box-shadow:0px 0px 2px 2px #ccc;-webkit-box-shadow:0px 0px 2px 2px #ccc;box-shadow:0px 0px 2px 2px #ccc;}section.main_title h1{margin-top:140px;font-size:256px;}
section.main_title h2{margin-top:20px;font-size:56px;}
section.title h1{margin-top:310px;font-size:40px;}
section.top_title h1{margin-top:22px;margin-bottom:15px;font-size:36px;}
section.top_title a{display:block;margin-top:30px;font-size:28px;}
section.code_title h1{font-family:"Courier New",monospace;margin-top:310px;font-size:42px;}
section.code_slide h1{font-family:"Courier New",monospace;margin-top:22px;font-size:36px;}
section.code_slide div.codes{position:absolute;left:10px;bottom:10px;right:517px;top:90px;}section.code_slide div.codes textarea{font-family:"Courier New",monospace;text-align:left;width:100%;height:100%;border:1px solid #ccc;font-size:16px;padding:4px 4px;resize:none;outline:none;white-space:pre;}section.code_slide div.codes textarea.init{display:none;}
section.code_slide div.codes div.button_bar{position:absolute;right:16px;bottom:4px;}section.code_slide div.codes div.button_bar div.reset,section.code_slide div.codes div.button_bar div.run{margin:3px;}
section.code_slide div.out{position:absolute;right:10px;bottom:10px;left:517px;top:90px;border:1px solid #ccc;}section.code_slide div.out div.error{position:absolute;background:white;top:5px;left:5px;right:5px;color:red;border:2px solid red;z-index:100;padding:10px;font-size:16px;}
section.code_slide div.out pre.log{position:absolute;background:white;top:5px;left:5px;right:5px;border:2px solid black;z-index:99;padding:10px;font-size:16px;text-align:left;}
section .name,section .date{position:absolute;bottom:20px;color:#999;}
section .name{left:20px;}
section .date{right:20px;}
section svg{width:100%;height:100%;}section svg rect{fill:#ccc;stroke:gray;stroke-width:2px;}
section svg text{font:16px sans-serif;}
section a{color:steelblue;}
section a:not(:hover){text-decoration:none;}
section .mmx{position:absolute;left:50%;margin-left:-150px;bottom:3px;}