.fnn-results {
    height: 100vh;
}

.fnn-results .hidden-grid {
    display: none;
}

.tables {
    display: flex;
    flex-direction: column;
    gap: 30px;
    overflow-y: auto;
    height: 100%;
    padding-top: 30px;
    padding-bottom: 30px;
}

.grid {
    display: grid;
    grid-template-columns: 1fr min-content 2fr min-content 1fr 1fr 72px 1fr;
    grid-auto-flow: dense;
    border-top: 1px solid #E7E7E7;
    border-right: 1px solid #E7E7E7;
}

.cell {
    border-bottom: 1px solid #E7E7E7;
    border-left: 1px solid #E7E7E7;
    display: flex;
    min-height: 68px;
    color: #707070;
    font-weight: bold;
    padding: 2px;
    padding-right: 4px;
    padding-left: 4px;
    font-family: "Roboto", sans-serif;
    line-height: 1.5em;
}

.no-border {
    border: none;
}

.no-left-border {
    border-left: none;
}

.gray-cell {
    background-color: #E7E7E7;
}

/****name-gz-cell*****/
.name-gz-cell {
    grid-row: span 1;
    grid-column: span 1;
    align-items: center;
    padding-left: 10px;
    font-size: 20px;
}

.name-gz-cell.header-cell {
    grid-row: span 1;
    grid-column: span 1;
}

.name-gz-cell.parent-cell {
    grid-row: span 1;
    grid-column: span 3;
}

/****************gz-img-cell****************/
.gz-img-cell.parent-cell {
    grid-row: span 1;
    grid-column: span 1;
}

/************range-owner************/
.range-owner-cell {
    grid-row: span 1;
    grid-column: span 2;
    font-size: 16px;
}

.range-owner-cell.header-cell {
    grid-row: span 1;
    grid-column: span 3;
}

/**********range-owner-img-cell************/
.range-owner-img-cell {
    grid-row: span 1;
    grid-column: span 1;
}

/*************type-cell**********/
.type-cell {
    grid-row: span 1;
    grid-column: span 1;
    font-size: 12px;
}

/*************start-cell**********/
.start-cell {
    grid-row: span 1;
    grid-column: span 1;
    font-size: 12px;
    font-size: 12px;
}

/*************img-cell**********/
.img-cell {
    grid-row: span 1;
    grid-column: span 1;
}

/*************end-cell**********/
.end-cell {
    grid-row: span 1;
    grid-column: span 1;
    font-size: 12px;
}

.type-cell,
.start-cell,
.img-cell,
.end-cell {
    justify-content: center;
    align-items: center;
    text-align: center;
}

.fnn-results .org-logo {
    min-height: 38px;
    min-width: 38px;
    margin-left: 6px;
    margin-right: 6px;
    filter: grayscale(1);
}

.range-logo {
    width: 71px;
}

.range-owner-cell-text {
    display: flex;
    height: 100%;
    width: 100%;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.header-cell {
    min-height: 40px;
    align-items: center;
    justify-content: center;
    text-align: center;
    color: black;
    font-weight: bold;
    font-size: 14px;
    display: none;
}

.tables .first-grid .header-cell {
    display: flex;
}

@media (min-width: 1110px) {
    #page-content .fnn-results {
        padding: 20px 0;
    }
}

@media (max-width: 900px) {
    .fnn-results .grid {
        grid-template-columns: min-content 2fr 1fr 1fr 72px 1fr;
        grid-auto-flow: dense;
    }

    /****name-gz-cell*****/
    .fnn-results .name-gz-cell.child-cell {
        display: none;
    }

    .fnn-results .name-gz-cell.header-cell {
        display: none;
    }

    .fnn-results .name-gz-cell.parent-cell {
        grid-row: span 1;
        grid-column: 2 / 3;
        font-size: 16px;
        justify-content: center;
    }

    /****************gz-img-cell****************/
    .fnn-results .gz-img-cell.parent-cell {
        grid-row: span 1;
        grid-column: 1 / 2;
    }

    /************range-owner************/
    .fnn-results .range-owner-cell.child-cell {
        grid-row: span 1;
        grid-column: 2 / 3;
        font-size: 14px;
    }

    .fnn-results .range-owner-cell.header-cell {
        grid-row: span 1;
        grid-column: span 2;
        border-left: 1px solid #E7E7E7;
    }

    /**********range-owner-img-cell************/
    .fnn-results .range-owner-img-cell.child-cell {
        grid-row: span 1;
        grid-column: 1 / 2;
    }

    /*************type-cell**********/
    .fnn-results .type-cell.child-cell {
        grid-row: span 1;
        grid-column: span 1;
        font-size: 12px;
    }

    .fnn-results .type-cell.parent-cell {
        grid-row: span 1;
        grid-column: 3 / 4;
        font-size: 12px;
    }

    /*************start-cell**********/
    .fnn-results .start-cell.child-cell {
        grid-row: span 1;
        grid-column: span 1;
        font-size: 12px;
    }

    .fnn-results .start-cell.parent-cell {
        grid-row: span 1;
        grid-column: 4 / 5;
        font-size: 12px;
    }

    /*************img-cell**********/
    .fnn-results .img-cell.child-cell {
        grid-row: span 1;
        grid-column: span 1;
    }

    .fnn-results .img-cell.parent-cell {
        grid-row: span 1;
        grid-column: 5 / 6;
    }

    /*************end-cell**********/
    .fnn-results .end-cell.child-cell {
        grid-row: span 1;
        grid-column: span 1;
        font-size: 12px;
    }

    .fnn-results .end-cell.parent-cell {
        grid-row: span 1;
        grid-column: 6 / 7;
        font-size: 12px;
    }

    .fnn-results .header-cell {
        font-size: 14px !important;
    }

}

@media (max-width: 600px) {
    .fnn-results .grid {
        grid-template-columns: min-content 2fr 1fr 30px 1fr;
        grid-auto-flow: dense;
    }

    .fnn-results .header-cell {
        display: none !important;
    }

    /****name-gz-cell*****/
    .fnn-results .name-gz-cell.child-cell {
        display: none;
    }

    .fnn-results .name-gz-cell.parent-cell {
        grid-row: span 1;
        grid-column: 2 / 6;
        font-size: 12px;
        justify-content: start;
        padding-left: 10px;
    }

    /****************gz-img-cell****************/
    .fnn-results .gz-img-cell.parent-cell {
        grid-row: span 2;
        grid-column: 1 / 2;
    }

    /************range-owner************/
    .fnn-results .range-owner-cell.child-cell {
        grid-row: span 1;
        grid-column: 2 / 6;
        font-size: 12px;
        border-bottom: none;
    }

    /**********range-owner-img-cell************/
    .fnn-results .range-owner-img-cell.child-cell {
        grid-row: span 2;
        grid-column: 1 / 2;
    }

    /*************type-cell**********/
    .fnn-results .type-cell.child-cell {
        grid-row: span 1;
        grid-column: 2 / 3;
        font-size: 10px;
        border-left: none;
    }

    .fnn-results .type-cell.parent-cell {
        grid-row: span 1;
        grid-column: 2 / 3;
        font-size: 10px;
        background-color: #E7E7E7;
    }

    /*************start-cell**********/
    .fnn-results .start-cell.child-cell {
        grid-row: span 1;
        grid-column: 3 / 4;
        font-size: 10px;
        border-left: none;
    }

    .fnn-results .start-cell.parent-cell {
        grid-row: span 1;
        grid-column: 3 / 4;
        font-size: 10px;
        background-color: #E7E7E7;
    }

    /*************img-cell**********/
    .fnn-results .img-cell.child-cell {
        grid-row: span 1;
        grid-column: 4 / 5;
    }

    .fnn-results .img-cell.parent-cell {
        grid-row: span 1;
        grid-column: 4 / 5;
        background-color: #E7E7E7;
    }

    /*************end-cell**********/
    .fnn-results .end-cell.child-cell {
        grid-row: span 1;
        grid-column: 5 / 6;
        font-size: 10px;
    }

    .fnn-results .end-cell.parent-cell {
        grid-row: span 1;
        grid-column: 5 / 6;
        font-size: 10px;
        background-color: #E7E7E7;
    }

    .fnn-results .range-owner-cell.child-cell .range-owner-cell-text {
        justify-content: start;
        padding-left: 10px;
    }

    .cell {
        min-height: 36px;
    }

     .fnn-results .org-logo {
        min-height: 32px;
        min-width: 32px;
        margin-left: 4px;
        margin-right: 4px;
    }
}

@media (max-width: 500px) {
    .cell {
        min-height: 32px;
    }

    .fnn-results .name-gz-cell,
    .fnn-results .range-owner-cell.child-cell .range-owner-cell-text {
        line-height: 1.2;
        font-size: 10px;
        overflow: hidden;
    }

    .fnn-results .org-logo {
        min-height: 30px;
        min-width: 30px;
        margin-left: 4px;
        margin-right: 4px;
    }
}