Codepen custom styles

/* Custom CSS for Codepen Vertical Perspecitve 

   Demo: http://i.imgur.com/NWaoRqi.png
*/

/* Requires Stylebot for Chrome - https://chrome.google.com/webstore/detail/stylebot/oiaejidbmkiecgbjeifoejpgmdaleoha?hl=en */

.top-boxes, #result_div {
    height: 100%;
}

.top-boxes {
    position: absolute;
    top: 0px ;
    right: 0px ;
    width: 40% ;
}

#result_div {
    overflow: hidden;
    width: 60% ;
    top: 0px;
}

#result_div #result {
}

#vert-resizer {
    display: none;
}

.box {
    width: 100%;
    left: 0px;
    
    -webkit-transition: height 0.4s ease,left 0.4s ease,box-shadow 0.4s ease;
    -moz-transition: height 0.4s ease,left 0.4s ease,box-shadow 0.4s ease;
    -o-transition: height 0.4s ease,left 0.4s ease,box-shadow 0.4s ease;
    transition: height 0.4s ease,left 0.4s ease,box-shadow 0.4s ease;
}

.box-html {
    top: 0px;
    height: 33%;
}

.box-css {
    top: 33%;
    height: 33%;
}

.box-js {
    top: 66%;
    height: 33%;
}

.box.expanded {
    top: 0px;
    height: 100%;
}

.code-wrap {
    height: 100%;
}

.CodeMirror-wrap {
    height: 100%;
    padding-bottom: 30px;
}

.CodeMirror-scroll {
    height: 100%;
}