/*------------------------------------*\

    WebFX WYSIWYG Customizations - Global styling for all ACF WYSIWYG's

    Add custom WYSIWYG styling to this file if it should be applied to all ACF WYSIWYG's on the site
    Otherwise, put your block-specific styles in individual block stylesheets

\*------------------------------------*/

.wysiwyg {
    position: relative;
}

.bg-white {
    background: #ffffff;
}

.bg-gray {
    background: #F6F7F7;
    /* Change request from the client -> https://docs.google.com/spreadsheets/d/1SRUfS6gZwjn6fVG6CYq7qrE9caWoCxywU_uz4K5WA0E/edit?gid=349087680#gid=349087680 */
    background: #DCDDDE;
}

.bg-dark-gray {
    background: #1B1B1B;
    color: #FFFFFF;
}

.bg-light-gray {
    background: #5D5F63;
    color: #FFFFFF;
}

.bg-dark-gray h1,
.bg-dark-gray h2,
.bg-dark-gray h3,
.bg-dark-gray h4,
.bg-dark-gray h5,
.bg-dark-gray h6,
.bg-light-gray h1,
.bg-light-gray h2,
.bg-light-gray h3,
.bg-light-gray h4,
.bg-light-gray h5,
.bg-light-gray h6 {
    color: #FFFFFF;
}

.color-red {
    color: #B6141D;
}

.wysiwyg p + h3,
.wysiwyg p + h4 {
    margin-top: 30px;
}

.bg-light-gray p a:not(.btn),
.bg-dark-gray p a:not(.btn) {
    background: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 100%);
    background-position: 0 100%;
    background-repeat: repeat-x;
    background-size: 4px 2px;
    color: #FFFFFF;
}

.bg-dark-gray .btn,
.bg-light-gray .btn {
    color: #ffffff;
}

.bg-dark-gray .btn::after,
.bg-light-gray .btn::after {
    color: inherit;
}

.wysiwyg__wrapper .btn:last-child{
    margin-top: 0 !important;
}

@media (min-width: 768px) {
    .wysiwyg p + h3,
    .wysiwyg p + h4 {
        margin-top: 35px;
    }
}

@media (min-width: 1200px) {
    .masthead--innerpage+.wysiwyg {
        padding-top: 80px;
    }

    .bg-light-gray p a:not(.btn):hover,
    .bg-dark-gray p a:not(.btn):hover {
        background: linear-gradient(to bottom, #FFFFFF 0%, #FFFFFF 100%);
        background-position: 0 100%;
        background-repeat: repeat-x;
        background-size: 4px 50px;
        color: #000;
    }

    .wysiwyg__wrapper .btn:last-child{
        margin-top: 0 !important;
    }
}

/* Ninja Table */
.wysiwyg__wrapper .footable_parent {
    overflow-x: visible;
}

.wysiwyg__wrapper .footable_parent table {
    border: none!important;
}

tr.footable-filtering {
    border: 0!;
}

tr.footable-filtering th {
    background: #000000!important;
    padding: 13px 20px!important;
    border-radius: 0!important;
}

.footable-filtering-search .btn::after,
.footable-filtering-search .btn::before {
    display: none!important;
}

.footable-filtering-search .btn-primary {
    background: #EFEDEB!important;
    color: #000000!important;
    border: none!important;
}

.footable-filtering-search .fooicon-search::before {
    font-family: 'fosterfuels-icon' !important;
    speak: never;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    content: "\e90c" !important;
}

.footable-filtering-search ul.dropdown-menu li.dropdown-header {
    padding: 0 20px!important;
}

.footable-filtering-search ul.dropdown-menu li {
    padding: 0!important;
}

.footable-filtering-search ul.dropdown-menu li:before {
    display: none!important;
}

.footable-filtering-search ul.dropdown-menu li a {
    background: none!important;
}

tr.footable-header th {
    padding: 16px 16px!important;
    text-align: left!important;
    font-size: 20px!important;
    line-height: 1.7em!important;
    font-weight: 400!important;
    border: none!important;
    color: #000000!important;
    vertical-align: middle!important;
    font-family: "Poppins",sans-serif!important;
    background: #F6F7F7!important;
}

table.ninja_footable tbody tr td {
    padding: 16px 16px!important;
    text-align: left!important;
    font-size: 16px!important;
    font-weight: 400!important;
    color: #3A4E50!important;
    line-height: 1.7em!important;
    vertical-align: middle!important;
    border: none!important;
}

table.ninja_footable tbody tr:nth-child(even) {
    background-color: #F6F7F7!important;
}