table {
    width: 100%;
}

nav{
    margin-bottom: 10px;
}

.all-time-leaderboard-table, footer {
    margin-top: 10px;
}

.movies-table, .leaderboard-table, .all-time-leaderboard-table {
    border-collapse: collapse;
    border: 3px solid black;
}

.movies-table-header tr th, .leaderboard-table-header tr th, .all-time-leaderboard-table-header tr th, .movies-table-footer-row td{
    text-align: left;
    padding: 5px;
    border: 1px solid black;
}

.movies-table-header-row th, .leaderboard-table-header-row th, .all-time-leaderboard-table-header-row th, .movies-table-footer-row td {
    background-color: #eeeee4;
}

.movies-table-body tr td, .leaderboard-table-body tr td, .all-time-leaderboard-table-body tr td, .movies-table-footer tr td{
    text-align: left;
    padding: 5px;
    margin: auto;
    vertical-align: middle;
}

.movies-table-body-row:not(:last-child), .leaderboard-table-body-row:not(:last-child), .all-time-leaderboard-table-body-row:not(:last-child){
    border-bottom: 1px solid black;
}

.selected-unreleased-status, #rubric-selected-unreleased-status {
    background-color: #E2EA18;
}

.released-status, #rubric-released-status {
    background-color: #3CDD18;
}

.moved-status, #rubric-moved-status {
    background-color: #F40909;
    color: white;
}

.no-release-date-status, #rubric-no-release-date-status {
    background-color: #ED9A0C;
}

.streaming-status, #rubric-streaming-status {
    background-color: #1095E0;
    color: white;
}

.out-of-theaters-status, #rubric-out-of-theaters-status {
    background-color: #5C16A8;
    color: white;
}

.movies-table-footer tr td {
    font-weight: bold;
}

.place-1 {
    background-color: #FFD700;
}

.place-2 {
    background-color: #C0C0C0;
}

.place-3 {
    background-color: #CD7F32;
}

/* Will show fun cursors for any screen >= 1024px */
@media (min-width: 1024px){
    .movies-table-body-row:hover, .leaderboard-table-body-row:hover, .all-time-leaderboard-table-body-row:hover{
        background-color: black;
        color: white; 
    }

    .Aaron-column:hover{
        cursor: url(https://cur.cursors-4u.net/sports/spo-1/spo77.cur), auto !important;
    }

    .Angi-column:hover{
        cursor: url(https://cur.cursors-4u.net/toons/too-7/too635.cur), auto !important;
    }

    .Dylan-column:hover{
        cursor: url(https://cur.cursors-4u.net/toons/too-10/too1032.cur), auto !important;
    }

    .Eden-column:hover{
        cursor: url(https://cur.cursors-4u.net/games/gam-12/gam1191.cur),url(https://cur.cursors-4u.net/toons/too-10/too932.cur),  auto !important;
    }

    .Kayla-column:hover{
        cursor: url(https://ani.cursors-4u.net/movie/mov-2/mov158.cur), auto !important;
    }

    .Ken-column:hover{
        cursor: url(https://cur.cursors-4u.net/mechanics/mec-4/mec338.cur), auto !important;
    }

    .Joanne-column:hover{
        cursor: url(https://cur.cursors-4u.net/people/peo-3/peo277.cur), auto !important;
    }

    .None-column:hover{
        cursor: url(https://cur.cursors-4u.net/holidays/hol-1/hol18.cur), auto !important;
    }
}

/* Tablet Landscape + Small Laptop */
@media (max-width: 1180px) {
    .release-date-header, .title-header, .owner-header, .cost-header, .box-office-total-header,
    .person-header, .revenue-per-dollar-column, .revenue-total-column, .cost-total-header, .movie-count-header{
        display: table-cell;
    }

    .genre-header, .description-header, .stars-header,
    .genre-column, .description-column, .stars-column {
        display: none;
    }

    .release-date-header, .release-date-column{
        font-size: 18px;
    }

    .title-header, .title-column{
        font-size: 18px;
    }

    .owner-header, .owner-column {
        font-size: 18px;
    }

    .cost-header, .cost-column {
        font-size: 18px;
    }

    .box-office-total-header, .box-office-total-column {
        font-size: 18px;
    }

    .person-header, .person-column {
        font-size: 18px;
    }

    .revenue-per-dollar-header, .revenue-per-dollar-column {
        font-size: 18px;
    }

    .revenue-total-header, .revenue-total-column {
        font-size: 18px;
    }

    .cost-total-header, .cost-total-column {
        font-size: 18px;
    }

    .movie-count-header, .movie-count-column {
        font-size: 18px;
    }

    #last-updated-span {
        font-size: 18px;
    }
}

/* Mobile Horizontal Screen + Small Tablets */
@media (max-width: 835px) {
    .release-date-header, .title-header, .owner-header, .cost-header, .box-office-total-header,
    .person-header, .revenue-per-dollar-column, .revenue-total-column, .cost-total-header, .movie-count-header{
        display: table-cell;
    }

    .genre-header, .description-header, .stars-header,
    .genre-column, .description-column, .stars-column {
        display: none;
    }

    .release-date-header, .release-date-column{
        font-size: 16px;
    }

    .title-header, .title-column{
        font-size: 16px;
    }

    .owner-header, .owner-column {
        font-size: 16px;
    }

    .cost-header, .cost-column {
        font-size: 16px;
    }

    .box-office-total-header, .box-office-total-column {
        font-size: 16px;
    }

    .person-header, .person-column {
        font-size: 16px;
    }

    .revenue-per-dollar-header, .revenue-per-dollar-column {
        font-size: 16px;
    }

    .revenue-total-header, .revenue-total-column {
        font-size: 16px;
    }

    .cost-total-header, .cost-total-column {
        font-size: 16px;
    }

    .movie-count-header, .movie-count-column {
        font-size: 16px;
    }

    #last-updated-span {
        font-size: 16px;
    }
}

/* Mobile Verticle Screen */
@media (max-width: 420px) {
    .release-date-header, .title-header, .owner-header, .cost-header, .box-office-total-header,
    .person-header, .revenue-per-dollar-header, .revenue-total-header,
    .all-time-person-header, .all-time-title-header, .all-time-revenue-total-header, .all-time-revenue-per-dollar-header{
        display: table-cell;
    }

    .genre-header, .description-header, .stars-header,
    .genre-column, .description-column, .stars-column,
    .cost-total-header, .movie-count-header,
    .cost-total-column, .movie-count-column,
    .movie-revenue-per-dollar-header, .movie-revenue-per-dollar-column,
    .all-time-release-date-header, .all-time-release-date-column,
    .all-time-cost-total-header, .all-time-cost-total-column
    {
        display: none;
    }

    .release-date-header, .release-date-column{
        font-size: 11px;
        width: 10%;
    }

    .title-header, .title-column{
        font-size: 11px;
        width: 40%;
    }

    .table-header {
        font-size: 14px;
    }

    .owner-header, .owner-column {
        font-size: 11px;
        width: 10%;
    }

    .cost-header, .cost-column {
        font-size: 11px;
        width: 10%;
    }

    .box-office-total-header, .box-office-total-column {
        font-size: 11px;
        width: 30%;
    }

    .person-header, .person-column {
        font-size: 14px;
        width: 10%;
    }

    .revenue-per-dollar-header, .revenue-per-dollar-column {
        font-size: 14px;
        width: 45%;
    }

    .revenue-total-header, .revenue-total-column {
        font-size: 14px;
        width: 45%;
    }

    .all-time-person-header, .all-time-person-column,
    .all-time-title-header, .all-time-title-column,
    .all-time-revenue-total-header, .all-time-revenue-total-column,
    .all-time-revenue-per-dollar-header,.all-time-revenue-per-dollar-column {
        font-size: 14px;
    }

    #last-updated-span {
        font-size: 12px;
    }
}