<div class="container-fluid" style="height:100vh; ">
<div class="row">
<div class="col-sm-2 portlet-container portlet-dropzone border border-info" style="background-color:#a6bfcc ; height:50vh; overflow: scroll " >  

  <div id="container" class="demo_container">
    <!--
    aici e meniul stang TreeView
    -->
</div>

</div>

<div class="col-sm-10 portlet-container portlet-dropzone border border-info" style="background-color:#f0f0f5; height:100vh;" >  

    <nav class="navbar-toggler mt-1 border border-dark" style="background-color: #585858;">
      <form class="form-inline" action="">
          <input class="form-control form-control-sm" type="text" id='ipnr' placeholder="" disabled >
          <button class="btn btn-sm btn-success my-2 my-sm-0" type="submit">(ID)Client IP adress</button>
          
          <div  style="position:relative; left: 0px;  top: 0px; height:3%; width:22%; float:left; text-align: center;">
             <label style="vertical-align: right; color: #f8f2f2">GT.M Routines Faciliti </label>
          </div>
          <button class="btn btn-sm btn-info my-2 my-sm-0" type="submit">$zg</button>
          <input class="form-control form-control-sm" type="text" id='zg' placeholder="" disabled >
          <button class="btn btn-sm btn-info my-2 my-sm-0" type="submit">$zd</button>
          <input class="form-control form-control-sm order-md-last" type="text" id='zd' placeholder="" disabled >
      </form>
    </nav>

  <!--  
  <h4 align="center">MUMPS Routines Editor for GT.M</h4>
  -->
      
      <div class="input-group">
      <input type="text" class="form-control form-control-sm" aria-label="test"> 
      <div class="btn-group btn-group-sm" role="group" aria-label="First group">
      <button class="btn btn-sm btn-outline-dark"><i class="fa fa-folder-open"> Load</i></button>
      <button class="btn btn-outline-dark btn-sm"><i class="fa fa-undo"></i> Undo</button>
      <button class="btn btn-outline-dark btn-sm"><i class="fa fa-repeat"></i> Redo</button>
      <button class="btn btn-outline-dark btn-sm"><i class="fa fa-cogs"></i> Compile</button>
      <button class="btn btn-outline-dark btn-sm"><i class="fa fa-save"></i> Save</button>
      <button class="btn btn-outline-dark btn-sm" href="#"><i class="fa fa-paste" title="Align Left"></i> Paste</button>

      <a class="btn btn-outline-dark btn-sm" href="#">
        <i class="fa fa-align-center" title="Align Center"></i> 
      </a>
      <a class="btn btn-outline-dark btn-sm" href="#">
        <i class="fa fa-align-right" title="Align Right"></i>
      </a>
      <a class="btn btn-outline-dark btn-sm" href="#">
        <i class="fa fa-align-justify" title="Align Justify"></i>
      </a>
      
    </div>

  <!--<textarea name='txtcm' id='txtcm' cols='120' rows='140' onClick='f_getline();'></textarea> 
  -->  
  
  <textarea id="txtcm" class="form-control" cols='120' rows="24" style="height:auto; width:auto; overflow: scroll"></textarea>
 

  <div id='debug' style='position:relative; left: 0px;  top:5px; bottom:0px; height:20%; width:100%; float:right; overflow: auto;background: transparent; border: 1px solid #2384b8;'>
    
    <!-- ;***** Custom Panel "Save ...," --> 
     <div class="btn-group btn-group-sm" role="group" aria-label="First group">
        <button class="btn btn-sm btn-outline-dark"><i class="fa fa-recycle"></i> Refresh</button>
        <button class="btn btn-outline-dark btn-sm"><i class="fa fa-bars"></i> Menu</button>
        <button class="btn btn-outline-dark btn-sm"><i class="fa fa-trash"></i> Trash</button>
        <button class="btn btn-outline-dark btn-sm"><i class="fa fa-close"></i> Close</button>
        <button class="btn btn-outline-dark btn-sm"><i class="fa fa-folder"></i> Folder</button> 
     <a class="btn btn-outline-dark btn-sm" href="#">
        <i class="fa fa-align-left" title="Align Left"></i>
      </a>
      <a class="btn btn-outline-dark btn-sm" href="#">
        <i class="fa fa-align-center" title="Align Center"></i>
      </a>
      <a class="btn btn-outline-dark btn-sm" href="#">
        <i class="fa fa-align-right" title="Align Right"></i>
      </a>
      <a class="btn btn-outline-dark btn-sm" href="#">
        <i class="fa fa-align-justify" title="Align Justify"></i>
      </a>
     </div>

   <textarea id='myTextarea' name='myTextarea' class="form-control" style='width:100%; overflow: scroll' rows='5' onClick="f_textarea();"></textarea>
   </div>
   </div>
   <!--  ; End Debuger **** -->
   
</div>

</div>

</div>