body,html{height:100%}.preview{overflow-y:hidden}.preview iframe{height:100%;width:100%}.editor .controls{background-color:#f3f3f3;border-bottom:1px solid #ccc;border-top:1px solid #a3a3a3;display:flex;height:36px;padding:0 8px}.editor .control-css,.editor .control-html,.editor .control-javascript{height:36px;line-height:36px;padding:0 16px;text-align:center;transition:all .2s cubic-bezier(.4,0,.2,1),box-shadow .2s cubic-bezier(.4,0,1,1)}.editor .control-css:hover,.editor .control-html:hover,.editor .control-javascript:hover{background-color:#e5e5e5}.editor .control-active,.editor .control-active:hover{background-color:#cfcfcf}.editor .control-drag{cursor:n-resize;flex-grow:1}.editor .control-live-mode,.editor .control-run{margin:0 8px}.editor .code{border-right:1px solid rgba(0,0,0,.12);box-sizing:border-box;float:left}.editor .code>pre{height:calc(100% - 40px);margin:0;width:100%}.editor .code-label{color:rgba(0,0,0,.5);font-size:13px;font-weight:700;line-height:20px;padding:10px;-webkit-user-select:none;user-select:none}