table
{
    width: 100%;
    background-color: #fff;
    border-collapse: collapse;
}

th
{
    border-top: 0;
    color: #74788d;
    font-size: 16px;
    line-height: 1.5;
    text-align: left;
    font-weight: 500;
    vertical-align: top;
    box-sizing: border-box;
    font-family: "Google Sans", sans-serif;
}

td
{
    border: 0;
    color: #595d6e;
    font-size: 13px;
    line-height: 1.5;
    text-align: left;
    font-weight: 300;
    vertical-align: top;
    box-sizing: border-box;
    padding: 20px 6px 10px 0;
    border-collapse: collapse;
    font-family: "Google Sans", sans-serif;
}

td, th
{
    text-align: left;
}

td > span
{
    display: block;
    width: 100%;
}

thead label
{
    color: #74788d!important;
    font-size: 16px!important;
    line-height: 1.5!important;
    text-align: left!important;
    font-weight: 500!important;
}

@media only screen and (max-width: 760px)
{

    table, thead, tbody, th, td, tr
    {
        display: block;
    }

    thead tr
    {
        display: none;
        visibility: visible;
    }

    thead tr th
    {
        box-sizing: border-box;
        display: inline-block;

        width: auto;
    }

    tr
    {
        padding-bottom: 2px;
        box-shadow: 0 2px 5px 0 rgba(0, 0, 0, .08);
    }

    tr > td:last-child
    {
        border: none;
    }

    td
    {
        border: none;
        padding-left: 50%;
        position: relative;
        border-bottom: 1px solid #eee;
    }

    td > select
    {
        margin-left: 50%;
        max-width: calc(50% - 10px);
    }

    td:before
    {
        top: 0;
        left: 10px;
        width: 45%;
        position: absolute;
        white-space: nowrap;
        text-overflow: ellipsis;
        padding: 20px 6px 10px 0;
        content: attr(data-title);
    }

    .qr-form-control
    {
        margin-bottom: 6px;
    }
}