/* ==========================================================================
   GLOBAL
   ========================================================================== */
/******************************/

.data-table-wrapper .wrapper {
    position: relative;
    margin: 0 auto;
    padding: 0 15px;
    max-width: 1100px;
}

.microsite-datatable .data-table-wrapper .wrapper {
    padding: 0;
}

    .microsite-datatable .data-table-wrapper .wrapper .col-md-24 {
        padding: 0;
        margin-left: -1em;
        margin-right: -1em;
    }

.data-table-wrapper .clear:before, .data-table-wrapper .clear:after {
    content: "";
    display: table;
}

.data-table-wrapper .clear:after {
    clear: both;
}

.data-table-wrapper .clear {
    zoom: 1; /* for IE 6/7 */
}


.data-table-wrapper a:link, .data-table-wrapper a:visited, .data-table-wrapper a:hover, .data-table-wrapper a:active {
    text-decoration: underline;
    color: #054D71;
}

.data-table-wrapper section {
    position: relative;
    z-index: 0;
}

.data-table-wrapper .italics {
    font-style: italic;
}

.data-table-wrapper .jumbotron {
    background: #4E6675;
    color: #FFF;
}


/* ==========================================================================
   TABLES
   ========================================================================== */
/******************************/
.data-table-wrapper {
    page-break-inside: avoid;
    margin-bottom: 20px;
}

    .data-table-wrapper .table-responsive {
        margin: 10px 0;
    }

    .data-table-wrapper td, .data-table-wrapper th {
        text-align: center;
        padding: 10px 14px;
        border-collapse: separate;
    }

    .data-table-wrapper thead th {
        border: none;
    }

    .data-table-wrapper thead, .data-table-wrapper tfoot {
        background: #CBDBD9;
    }

    .data-table-wrapper tfoot {
        background: #f3eed3;
    }

        .data-table-wrapper tfoot:hover {
            background: #efe8c3;
        }

    .data-table-wrapper tbody tr:nth-of-type(odd) {
        background: #f2f2f2;
    }

    .data-table-wrapper tbody tr:hover {
        background: #e2e2e2;
    }

    .data-table-wrapper .table-one td, .data-table-wrapper .table-one th,
    .data-table-wrapper .table-two td, .data-table-wrapper .table-two th {
        text-align: left;
    }




/* ==========================================================================
   MEDIA QUERIES
   ========================================================================== */
/******************************/

@media only screen and (max-width: 991px) {

    .microsite-datatable .data-table-wrapper .wrapper .col-md-24 {
        margin-left: 0;
        margin-right: 0;
    }
}

@media only screen and (max-width: 767px) {
    .data-table-wrapper .table-responsive {
        border: 1px solid #CBDBD9;
    }

    .data-table-wrapper table.table-one, .data-table-wrapper table.table-two {
        width: 100%;
    }

    .data-table-wrapper .table-one thead {
        display: none;
    }

    .data-table-wrapper .table-one th[data-title]:before, .data-table-wrapper .table-one td[data-title]:before {
        content: attr(data-title) ":";
        font-weight: bold;
        margin-right: 5px;
    }

    .data-table-wrapper .table-one td, .data-table-wrapper .table-one th,
    .data-table-wrapper .table-two td, .data-table-wrapper .table-two th {
        padding: 12px;
    }

    .data-table-wrapper .table-one tr, .data-table-wrapper .table-one th, .data-table-wrapper .table-one td,
    .data-table-wrapper .table-two tr, .data-table-wrapper .table-two th, .data-table-wrapper .table-two td {
        display: block;
        text-align: left;
    }

    .data-table-wrapper .table-two th {
        font-size: 20px;
    }
}

@media print {
    .data-table-wrapper {
        font-size: xx-small;
    }

        .data-table-wrapper .table-responsive {
            display: block;
            width: auto;
            height: auto;
            overflow: visible;
        }

        .data-table-wrapper thead th {
            border-bottom: 1px solid black;
        }

        .data-table-wrapper tbody th {
            border-right: 1px solid black;
        }

        .data-table-wrapper tfoot {
            border-top: 1px solid black;
        }
}
