#viewport{overflow:hidden;min-height:100%}
#viewport #main_view,#viewport #sub_view{width:100%;min-height:100%;transition:300ms}
#viewport #left_side{position:fixed;top:0;bottom:0;left:-220px;z-index:2000;transition:300ms}
#viewport #right_side{position:fixed;top:0;right:-220px;bottom:0;z-index:2000;transition:300ms}
#viewport #close_side{visibility:hidden;position:fixed;top:0;right:0;bottom:0;left:0;z-index:1900;width:100%;border:0;background:rgba(0,0,0,0.6);text-align:left;text-indent:-9999px;opacity:0;transition:visibility 0s .3s,opacity 0s .3s}
#viewport #header{box-sizing:border-box;width:100%;transition:300ms}
#viewport.app_view #container{padding-top:0}
#viewport.left-open #left_side{visibility:visible;left:0}
#viewport.left-open #close_side{visibility:visible;opacity:1;transition:visibiliy 0s 0s,opacity 0s 0s}
#viewport.right-open #right_side{visibility:visible;right:0}
#viewport.right-open #close_side{visibility:visible;opacity:1;transition:visibiliy 0s 0s,opacity 0s 0s}
#main_view{display:block}
#main_view #header{position:fixed;top:0;right:0;left:0;z-index:10000;height:50px}
#main_view #container{position:relative;z-index:100;padding-top:50px}
#sub_view{display:block}
#sub_view #header{position:fixed;top:0;right:0;left:0;z-index:10000;height:50px}
#sub_view #container{position:relative;z-index:100;padding-top:50px}
#left_side{display:block;visibility:hidden;overflow-x:hidden;overflow-y:auto;width:220px}
#right_side{display:block;visibility:hidden;overflow-x:hidden;overflow-y:auto;width:220px}