                    @media only screen and (max-width: 768px) {
                    .coll1 {
                        width: 100% !important;
                        vertical-align: top;
                        background-color: red;
                    }
                }
                
                @media only screen and (min-width: 768px) {
                    .coll1 {
                        width: 10% !important;
                        vertical-align: top;
                        background-color: yellow;
                    }
                }
                
                .coll2 {
                    width: 100% !important;
                    background-color: #fff !important;
                    vertical-align: top;
                }
                
                .filtro {
                    position: relative !important;
                    top: 0px !important;
                    left: 0px !important;
                    width: 100% !important;
                }
                
                .coll2 table {
                    position: relative !important;
                    top: 0px !important;
                    left: 0px !important;
                    width: 100% !important;
                }
                
                .invalido {
                    border-left: 10px solid salmon !important;
                }
                
                .msgerro {
                    background-color: salmon;
                }
                
                table {
                    width: 100% !important;
                    border-collapse: collapse;
                    position: relative;
                    left: 0px;
                    top: 0px;
                    font-size: 12px !important;
                }
                /* Zebra striping */
                
                tr:nth-of-type(odd) {
                    background: #eee;
                }
                
                th {
                    background: #3498db;
                    color: white;
                    font-weight: bold;
                }
                
                td,
                th {
                    padding: 10px;
                    border: 1px solid #ccc;
                    text-align: left;
                    font-size: 12px !important;
                    text-align: left !important;
                }
                
                @media only screen and (max-width: 760px),
                (min-device-width: 768px) and (max-device-width: 1024px) {
                    table {
                        width: 100%;
                    }
                    /* Force table to not be like tables anymore */
                    table,
                    thead,
                    tbody,
                    th,
                    td,
                    tr {
                        display: block;
                    }
                    /* Hide table headers (but not display: none;, for accessibility) */
                    thead tr {
                        position: absolute;
                        top: -9999px;
                        left: -9999px;
                    }
                    tr {
                        border: 1px solid #ccc;
                    }
                    td {
                        /* Behave  like a "row" */
                        border: none;
                        border-bottom: 1px solid #eee;
                        position: relative;
                        padding-left: 50%;
                    }
                    td:before {
                        /* Now like a table header */
                        position: absolute;
                        /* Top/left values mimic padding */
                        top: 6px;
                        left: 6px;
                        width: 45%;
                        padding-right: 10px;
                        white-space: nowrap;
                        /* Label the data */
                        content: attr(data-column);
                        color: #000;
                        font-weight: bold;
                    }
                }
                
                select {
                    -webkit-appearance: menulist !important;