diff --git a/app/resources/views/proyectos/brokers/contracts/show.blade.php b/app/resources/views/proyectos/brokers/contracts/show.blade.php
index a61db80..2c77b4d 100644
--- a/app/resources/views/proyectos/brokers/contracts/show.blade.php
+++ b/app/resources/views/proyectos/brokers/contracts/show.blade.php
@@ -14,67 +14,77 @@
         <b>Fecha Inicio:</b> {{ $contract->current()->date->format('d/m/Y') }} <br/>
     </div>
     <div class="ui active inline loader"></div>
-    <table class="ui table" id="tipos">
-        <thead>
-        <tr>
-            <th rowspan="2">Tipo</th>
-            <th class="center aligned" rowspan="2">Cantidad</th>
-            <th class="center aligned" colspan="3">Precio</th>
-            <th class="center aligned" colspan="3">Promoción</th>
-            <th class="right aligned" rowspan="2">Acciones</th>
-        </tr>
-        <tr>
-            <th class="right aligned">Mínimo</th>
-            <th class="right aligned">Promedio</th>
-            <th class="right aligned">Máximo</th>
-            <th class="right aligned">Mínima</th>
-            <th class="right aligned">Promedio</th>
-            <th class="right aligned">Máxima</th>
-        </tr>
-        </thead>
-        <tbody></tbody>
-    </table>
-    <table class="ui table" id="lineas">
-        <thead>
-        <tr>
-            <th rowspan="2">Tipo</th>
-            <th class="center aligned" rowspan="2">Línea</th>
-            <th class="center aligned" rowspan="2">Orientación</th>
-            <th class="center aligned" rowspan="2">Tipología</th>
-            <th class="center aligned" rowspan="2">Cantidad</th>
-            <th class="center aligned" colspan="3">Precio</th>
-            <th class="center aligned" colspan="3">Promoción</th>
-            <th class="right aligned" rowspan="2">Acciones</th>
-        </tr>
-        <tr>
-            <th class="right aligned">Mínimo</th>
-            <th class="right aligned">Promedio</th>
-            <th class="right aligned">Máximo</th>
-            <th class="right aligned">Mínima</th>
-            <th class="right aligned">Promedio</th>
-            <th class="right aligned">Máxima</th>
-        </tr>
-        </thead>
-        <tbody></tbody>
-    </table>
-    <div id="unidades_container">
-        <table class="ui table" id="unidades">
-            <thead>
-            <tr>
-                <th>Tipo</th>
-                <th>Tipo Order</th>
-                <th class="right aligned">Unidad</th>
-                <th>Unidad Orden</th>
-                <th>Estado</th>
-                <th class="right aligned">Precio</th>
-                <th class="right aligned">Promoción</th>
-                <th>Fecha Inicio</th>
-                <th>Fecha Término</th>
-                <th class="right aligned">Acciones</th>
-            </tr>
-            </thead>
-            <tbody></tbody>
-        </table>
+    <div id="results">
+        <div class="ui top attached tabular menu">
+            <a class="item active" data-tab="tipos">Tipos</a>
+            <a class="item" data-tab="lineas">Líneas</a>
+            <a class="item" data-tab="unidades">Unidades</a>
+        </div>
+        <div class="ui bottom attached tab basic horizontally fitted segment active" data-tab="tipos">
+            <table class="ui table" id="tipos">
+                <thead>
+                <tr>
+                    <th rowspan="2">Tipo</th>
+                    <th class="center aligned" rowspan="2">Cantidad</th>
+                    <th class="center aligned" colspan="3">Precio</th>
+                    <th class="center aligned" colspan="3">Promoción</th>
+                    <th class="right aligned" rowspan="2">Acciones</th>
+                </tr>
+                <tr>
+                    <th class="right aligned">Mínimo</th>
+                    <th class="right aligned">Promedio</th>
+                    <th class="right aligned">Máximo</th>
+                    <th class="right aligned">Mínima</th>
+                    <th class="right aligned">Promedio</th>
+                    <th class="right aligned">Máxima</th>
+                </tr>
+                </thead>
+                <tbody></tbody>
+            </table>
+        </div>
+        <div class="ui bottom attached tab basic horizontally fitted segment" data-tab="lineas">
+            <table class="ui table" id="lineas">
+                <thead>
+                <tr>
+                    <th rowspan="2">Tipo</th>
+                    <th class="center aligned" rowspan="2">Línea</th>
+                    <th class="center aligned" rowspan="2">Orientación</th>
+                    <th class="center aligned" rowspan="2">Cantidad</th>
+                    <th class="center aligned" colspan="3">Precio</th>
+                    <th class="center aligned" colspan="3">Promoción</th>
+                    <th class="right aligned" rowspan="2">Acciones</th>
+                </tr>
+                <tr>
+                    <th class="right aligned">Mínimo</th>
+                    <th class="right aligned">Promedio</th>
+                    <th class="right aligned">Máximo</th>
+                    <th class="right aligned">Mínima</th>
+                    <th class="right aligned">Promedio</th>
+                    <th class="right aligned">Máxima</th>
+                </tr>
+                </thead>
+                <tbody></tbody>
+            </table>
+        </div>
+        <div class="ui bottom attached tab basic horizontally fitted segment" data-tab="unidades">
+            <table class="ui table" id="unidades">
+                <thead>
+                <tr>
+                    <th>Tipo</th>
+                    <th>Tipo Order</th>
+                    <th class="right aligned">Unidad</th>
+                    <th>Unidad Orden</th>
+                    <th>Estado</th>
+                    <th class="right aligned">Precio</th>
+                    <th class="right aligned">Promoción</th>
+                    <th>Fecha Inicio</th>
+                    <th>Fecha Término</th>
+                    <th class="right aligned">Acciones</th>
+                </tr>
+                </thead>
+                <tbody></tbody>
+            </table>
+        </div>
     </div>
 @endsection
 
@@ -312,9 +322,8 @@
                             tbody.innerHTML += [
                                 `<tr>`,
                                 `<td>${tipo.charAt(0).toUpperCase() + tipo.slice(1)}</td>`,
-                                `<td class="center aligned">${linea}</td>`,
+                                `<td class="center aligned"><span data-tooltip="${unidades[0].proyecto_tipo_unidad.tipologia}" data-position="right center">${linea}</span></td>`,
                                 `<td class="center aligned">${orientacion}</td>`,
-                                `<td class="center aligned">${unidades[0].proyecto_tipo_unidad.tipologia}</td>`,
                                 `<td class="center aligned">${unidades.length}</td>`,
                                 `<td class="right aligned">UF ${units.formatters.ufs.format(precios.min)}</td>`,
                                 `<td class="right aligned">UF ${units.formatters.ufs.format(precios.avg)}</td>`,
@@ -363,18 +372,25 @@
                 }
                 $(`#${units.ids.units}`).DataTable(dto)
 
-                document.getElementById(units.ids.unidades_container).style.visibility = 'hidden'
-                document.getElementById(units.ids.tipos).style.visibility = 'hidden'
-                document.getElementById(units.ids.lineas).style.visibility = 'hidden'
+                $(`#${units.ids.results}`).find('.tabular.menu .item').tab({
+                    onVisible: function(tabPath) {
+                        if (tabPath !== 'unidades') {
+                            return
+                        }
+                        $(this.querySelector('table')).DataTable().columns.adjust().draw()
+                        this.querySelector('table').style.width = ''
+                    }
+                })
+                document.getElementById(units.ids.results).style.visibility = 'hidden'
 
                 units.get().units().then(() => {
                     units.get().prices().then(() => {
                         units.get().promotions().then(() => {
                             units.get().sold().then(() => {
                                 $(units.ids.loader).hide()
-                                document.getElementById(units.ids.unidades_container).style.visibility = 'visible'
-                                document.getElementById(units.ids.tipos).style.visibility = 'visible'
-                                document.getElementById(units.ids.lineas).style.visibility = 'visible'
+
+                                document.getElementById(units.ids.results).style.visibility = 'visible'
+
                                 units.draw().units()
                                 units.draw().tipos()
                                 units.draw().lineas()
@@ -385,7 +401,7 @@
             }
         }
         $(document).ready(function () {
-            units.setup({units: 'unidades', unidades_container: 'unidades_container', tipos: 'tipos', lineas: 'lineas', loader: '.ui.loader'})
+            units.setup({results: 'results', units: 'unidades', tipos: 'tipos', lineas: 'lineas', loader: '.ui.loader'})
         })
     </script>
 @endpush