css editor

*{
 margin:0;
   padding:0;
  font-family: Consolas, Monaco, Lucida Console, monospace;
   color:#000;
}
html{height:100%;}
.bersih{clear:both;}
a:link, a:hover, a:visited { text-decoration:none; color:#888;}
.background{background:url("http://www.nurulimam.com/wp-content/themes/h95vs4/images/bg.gif")}
#judul {
   margin:20px 0 20px 70px;
        font-size:20px;
        font-weight:normal;
  display: inline-block;
}
#alat{
   border-top:1px solid #e3e3e3;
   border-bottom:1px solid #e3e3e3;
    height:20px;
    padding:10px 0 10px 50px;
   box-shadow:0 5px 10px -7px rgba(0,0,0,.3);
  height:30px;
    background: -webkit-linear-gradient(top,#fff,#efefef);
}
#code,#demo{
 width:50%;
  float:left;
}
#alat h2{
   font-weight:normal;
 text-shadow:0 1px 1px white;
    color:#888;
 line-height:35px;
   display: inline-block;
}
#ide{
position: absolute;
padding-top:10px;
top:120px;
left:0;
right:0;
bottom:0;
}
#editor, #preview{
width:50%;
float:left;
height:100%;
  position:relative;
}
.lebar{
height:100%;
position: absolute;
top:-10px;
left:0;
right:0;
bottom:10px;
}
#editor .container{
  border-right:1px solid #e3e3e3;
 bottom:0;
}
.lebar textarea,.lebar iframe,.CodeMirror{
    height:100%;
    width:100%;
 resize:none;
    border:none;
    outline:none;
}
.lebar iframe{
    position:absolute;
}
.CodeMirror-scroll{height:100%  !important}
.CodeMirror-gutter,.CodeMirror-lines{line-height:20px;}
::-webkit-scrollbar {
  width : 5px;
    height: 5px;
}
::-webkit-scrollbar-thumb {
    -webkit-border-radius: 10px;
    border-radius        : 10px;
    background           : #A8DAEA;
}
::-webkit-slider-thumb element,
::-webkit-scrollbar-track {
  background           : white;
   -webkit-border-radius: 10px;
    border-radius        : 10px;
}