.editor { height: 100%; overflow: hidden; background: #333; color: white; cursor: default; -webkit-user-select: none; -webkit-box-flex: 1; position: relative; } .editor.mini { height: auto; } .editor .flexbox { display: -webkit-box; position: absolute; top: 0; bottom: 0; left: 0; right: 0; } .editor .gutter { height: 100%; overflow: hidden; padding-left: 0.4em; padding-right: 0.8em; color: rgba(255, 255, 255, .3); text-align: right; } .editor .gutter .line-numbers { position: relative; } .editor.mini .gutter { display: none; } .editor .gutter.drop-shadow { -webkit-box-shadow: -2px 0px 10px 2px #222; } .editor .vertical-scrollbar { position: absolute; right: 0; top: 0; bottom: 0; width: 10px; overflow-y: auto; } .editor .scroll-view { overflow-x: auto; overflow-y: hidden; -webkit-box-flex: 1; } .editor.mini .scroll-view { overflow: hidden; } .editor.soft-wrap .scroll-view { overflow-x: hidden; } .editor .lines { position: relative; display: table; height: 100%; width: 100%; } .editor .line, .gutter .line-number { white-space: pre; margin: 0; padding: 0; padding-bottom: .05em; z-index: 1; } .editor .line > span { vertical-align: top; } @-webkit-keyframes blink { 0% { opacity: .7; } 60% { opacity: .7; } 61% { opacity: 0; } 100% { opacity: 0; } } .editor .cursor { position: absolute; border-left: 3px solid rgba(255, 255, 255, .4); opacity: 0.7; } .editor.focused .cursor { border-color: #9dff9d; } .editor.focused .cursor.idle { -webkit-animation: blink 0.8s; -webkit-animation-iteration-count: infinite; } .editor .hidden-input { position: fixed; z-index: -1; top: 0; left: 0; opacity: 0; } .editor .selection { position: absolute; background: white; opacity: .25; pointer-events: none; }