table {
    font-size: smaller;
}

.table-responsive  .col-commands {
    text-align: center;
}

.summary-responsive {
    display: none !important;
    text-align: right;
    font-weight: bold;
    padding: 2px 10px;
    border: 1px solid #ccc;
    overflow-wrap: break-word;
}

@media (max-width: 768px) {
    .table-responsive {
        border: none !important;
    }
    /* force table to not be like tables anymore */

    .table-responsive  table,
    .table-responsive  thead,
    .table-responsive  tbody,
    .table-responsive  tfoot,
    .table-responsive  th,
    .table-responsive  td,
    .table-responsive  tr {
        display: block;
    }

    /* Hide table headers (but not display: none, for accessibility) */
    .table-responsive  thead tr/*, .table-responsive  tfoot tr*/ {
        position: absolute;
        top: -9999px;
        left: -9999px;
    }

    .table-responsive  tr { border: 1px solid #ccc }

    .table-responsive  td {
        /* Behave like "row" */
        border: none !important;
        border-bottom: 1px solid #eee;
        position: relative;
        padding-left: 40% !important;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }

    .table-responsive tfoot tr td {
        padding-left: 8px !important;
    }

    .table-responsive  td:before {
        /* now like table header */
        position: absolute;

        /* top/left mimic padding */
        top: 6px;
        left: 6px;
        width: 37%;
        padding-right: 10px;
        white-space: nowrap;
        overflow-wrap: break-word;
    }

    /* Label the data. Make this for each table :( */
    .table-responsive  .col-commands {
        text-align: left;
        overflow-wrap: break-word;
    }
    .table-responsive table tr td{
        overflow-x: scroll;

    }

    /*
    LATITUD 	LONGITUD 	ALTURA 	VER
-17.933922	-67.114464
    */

    /* Users */
    /*.table-responsive .users tbody td:nth-of-type(1):before { content: "ID"; font-weight: bold; }*/
    .table-responsive .users tbody td:nth-of-type(1):before { content: "NOMBRE"; font-weight: bold; }
    .table-responsive .users tbody td:nth-of-type(2):before { content: "USUARIO"; font-weight: bold; }
    .table-responsive .users tbody td:nth-of-type(3):before { content: "APELLIDO"; font-weight: bold; }
    .table-responsive .users tbody td:nth-of-type(4):before { content: "EMAIL"; font-weight: bold; }
    .table-responsive .users tbody td:nth-of-type(5):before { content: "ACCION"; font-weight: bold; }
    /* ROUTES */
    .table-responsive .routes tbody td:nth-of-type(1):before { content: "LATITUD"; font-weight: bold; }
    .table-responsive .routes tbody td:nth-of-type(2):before { content: "LONGITUD"; font-weight: bold; }
    .table-responsive .routes tbody td:nth-of-type(3):before { content: "ALTURA"; font-weight: bold; }

    .table-responsive .routesList tbody td:nth-of-type(1):before { content: "RUTA"; font-weight: bold; }
    .table-responsive .routesList tbody td:nth-of-type(2):before { content: "CREADA"; font-weight: bold; }
    .table-responsive .routesList tbody td:nth-of-type(3):before { content: "GESTION"; font-weight: bold; }
    .table-responsive .routesList tbody td:nth-of-type(4):before { content: "ACCESO"; font-weight: bold; }

    /*  RISK */
    .table-responsive .risk tbody td:nth-of-type(1):before { content: "LATITUD"; font-weight: bold; }
    .table-responsive .risk tbody td:nth-of-type(2):before { content: "LONGITUD"; font-weight: bold; }
    .table-responsive .risk tbody td:nth-of-type(3):before { content: "ALTURA"; font-weight: bold; }
    .table-responsive .risk tbody td:nth-of-type(4):before { content: "ACCION"; font-weight: bold; }
    /*  POI */
    .table-responsive .poi tbody td:nth-of-type(1):before { content: "LATITUD"; font-weight: bold; }
    .table-responsive .poi tbody td:nth-of-type(2):before { content: "LONGITUD"; font-weight: bold; }
    .table-responsive .poi tbody td:nth-of-type(3):before { content: "ALTURA"; font-weight: bold; }
    .table-responsive .poi tbody td:nth-of-type(4):before { content: "TIPO"; font-weight: bold; }
    .table-responsive .poi tbody td:nth-of-type(5):before { content: "ACCION"; font-weight: bold; }
    /*  RiskDetail */
    .table-responsive .riskDetail tbody td:nth-of-type(1):before { content: "NORMAL"; font-weight: bold; }
    .table-responsive .riskDetail tbody td:nth-of-type(2):before { content: "PREVENTIVA"; font-weight: bold; }
    /* poi map data */
    .table-responsive .POIinfo tbody td:nth-of-type(1):before { content: "TIPO"; font-weight: bold; }
    .table-responsive .POIinfo tbody td:nth-of-type(2):before { content: "SUBTIPO"; font-weight: bold; }
    .table-responsive .POIinfo tbody td:nth-of-type(3):before { content: "NOMBRE"; font-weight: bold; }
    .table-responsive .POIinfo tbody td:nth-of-type(4):before { content: "DESCRIPCION"; font-weight: bold; }
    .table-responsive .POIinfo tbody td:nth-of-type(5):before { content: "DIRECCION"; font-weight: bold; }

    .table-responsive .POIcontact tbody td:nth-of-type(1):before { content: "CONTACTO"; font-weight: bold; }
    .table-responsive .POIcontact tbody td:nth-of-type(2):before { content: "CARGO"; font-weight: bold; }
    .table-responsive .POIcontact tbody td:nth-of-type(3):before { content: "TELEFONO"; font-weight: bold; }
    .table-responsive .POIcontact tbody td:nth-of-type(4):before { content: "TELEFONO"; font-weight: bold; }

    .table-responsive .POIdata tbody td:nth-of-type(1):before { content: "LATITUD"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(2):before { content: "LONGITUD"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(3):before { content: "ALTURA"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(4):before { content: "COORD X"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(5):before { content: "COORD Y"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(6):before { content: "ZONA"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(7):before { content: "DEPARTAMENTO"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(8):before { content: "PROVINCIA"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(9):before { content: "MUNICIPALIDAD"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(10):before { content: "KILOMETRO"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(11):before { content: "PG DE SECCION"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(12):before { content: "SECCION"; font-weight: bold; }
    .table-responsive .POIdata tbody td:nth-of-type(13):before { content: "RUTA"; font-weight: bold; }
    /* route-photos data */
    .table-responsive .photosData tbody td:nth-of-type(1):before { content: "LATITUD"; font-weight: bold; }
    .table-responsive .photosData tbody td:nth-of-type(2):before { content: "LONGITUD"; font-weight: bold; }
    .table-responsive .photosData tbody td:nth-of-type(3):before { content: "ALTURA"; font-weight: bold; }
    .table-responsive .photosData tbody td:nth-of-type(4):before { content: "ACCION"; font-weight: bold; }


    .table-responsive .attachment tbody td:nth-of-type(1):before { content: "NOMBRE"; font-weight: bold; }
    .table-responsive .attachment tbody td:nth-of-type(2):before { content: "FECHA CARGA"; font-weight: bold; }
    .table-responsive .attachment tbody td:nth-of-type(3):before { content: "ACCIONES"; font-weight: bold; }
}