body{margin:0}.code{flex:1;margin:10px 50px;-moz-border-bottom-colors:none;-moz-border-left-colors:none;-moz-border-right-colors:none;-moz-border-top-colors:none;background:none repeat scroll 0 0 rgba(0,0,0,.07);border-color:-moz-use-text-color #FFFFFF #FFFFFF -moz-use-text-color;border-image:none;border-radius:6px;border-style:none solid solid none;border-width:medium 1px 1px medium;box-shadow:0 1px 2px #0000001f inset;color:#555;font-family:Helvetica Neue,Helvetica,Arial,sans-serif;font-size:1em;line-height:1.4em;padding:5px 8px;transition:background-color .2s ease 0s;resize:none}.container{position:absolute;top:0;bottom:0;left:0;right:0;display:flex}.codemirror{height:100%;flex:.5}.preview{flex:.5;-moz-border-bottom-colors:none;-moz-border-left-colors:none;-moz-border-right-colors:none;-moz-border-top-colors:none;color:#abb2bf;font-size:16px;line-height:1.4em;transition:background-color .2s ease 0s;resize:none;background-color:#282c34;border-left:2px solid;overflow-x:auto}@media (orientation: landscape){.container{flex-direction:row}.codemirror{margin-left:1rem}.preview{margin:0 1rem 0 0;border-left:2px solid}}@media (orientation: portrait){.container{flex-direction:column}.codemirror{margin:0 1rem}.preview{margin:0 1rem;border-top:2px solid}}