@media only screen and (max-width: 768px) {
    div.apps {
        bottom: 0;
    }

    div.app {
        height: 35px;
        width: 125px;
    }

    div.tabs {
        background-color: var(--light-background-color);
        width: 100vw;
    }

    div.tab {
        background-color: var(--light-background-color);
    }

    .heroes {
        min-height: auto;
    }

    .section-navigation.row {
        flex-direction: column-reverse;
        align-items: center;
    }

    div.navigation-tabs {
        justify-content: center;
        width: 100vw;
    }

    div.carousel-item-detail {
        width: 100vw;
    }
    #footer .info a {
        margin: 0 10px;
    }

    div.franchise-header {
        flex-direction: column;
        align-items: center;
    }

    div.season-list {
        margin-top: 25px;
    }
}

@media only screen and (max-width: 480px), only screen and (device-width: 414px) and (device-height: 896px) and (-webkit-device-pixel-ratio: 3) {
    div.navigationContainer {
        margin: 0;
        padding: 0;
    }

    div.navigationContainer div.left, div.navigationContainer div.center {
        display: none;
    }

    div.ad-space {
        height: auto;
    }

    div.navigationContainer div.right {
        justify-content: space-evenly;
        width: 100vw;
        margin: 0;
    }

    div.profile-menu div.up-arrow, div.login-menu div.up-arrow {
        margin-left: 220px;
    }

    div.main-menu div.up-arrow {
        margin-left: 260px;
    }

    div.search {
        margin-right: 10px;
    }

    div.search input {
        width: 40vw;
    }

    #main {
        top: 70px;
        padding-bottom: 10vh;
    }

    div.franchise-meta {
        margin-right: 0;
    }

    div.franchise-attributes {
        flex-direction: column;
    }

    div.franchise-attributes span.enumerated-list {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        margin: 5px 0;
    }

    span.list-item:last-of-type:after {
        content: "";
    }

    div.franchise-links div.social_link {
        margin: 5px 0;
    }

    .franchise-links {
        flex-direction: column;
    }

    div.apps {
        display: none;
    }

    .prev, .next {
        font-size: 20pt;
    }

    div.profile-menu, div.login-menu {
        right: 75px;
        width: 280px;
    }

    div.idm-container {
        width: 80vw;
    }

    div.idm-panel > div.row {
        display: block;
    }

    div.menu-header h1 {
        font-size: 20pt;
    }

    div.main-menu {
        right: 10px;
    }

    div.equitry-container {
        width: 100vw;
    }

    div.empty-watchlist-container {
        width: 400px;
    }

    div.carousel-item-detail {
        flex-direction: column;
    }

    div.carousel-item-detail-header {
        flex-direction: column;
        align-items: start;
    }

    div.carousel-item-detail-header div.promo-status {
        flex-flow: row;
    }

    div.carousel-item-detail-info {
        background-image: none;
    }

    div.carousel-item-detail-info p {
        width: 80vw;
    }

    div.carousel-item-xtra {
        display: flex;
        flex-direction: row-reverse;
        align-items: center;
        justify-content: start;
        padding: 0 0 10vh 10px;
        margin: 0;
    }
    div.carousel-item-actions {
        width: 80vw;
        justify-content: start;
        align-items: center;
        flex-direction: row;
    }
    #footer {
        height: 10vh;
        top: unset;
        bottom: 0;
    }

    #footer div.info {
        display: flex;
        flex-direction: column;
    }

    div.editor-container {
        width: 300px;
    }

    div.equitry {
        align-items: center;
    }

    div.equitry-container {
        padding: 15px;
    }

    div.section-title {
        width: 300px;
    }

    h1.section-title {
        font-size: 12pt;
    }

    div.mainContainer {
        padding: 0;
    }

    .franchise-action .caption {
        display: none;
    }

    div.season-list {
        max-width: 95vw;
    }


    div.season-list .caption {
        padding: 25px;
    }

    div.season img {
        width: 100%;
    }

    div.episode-carousel-item {
        width: 300px;
    }

    div.episode-poster {
        width: 290px;
    }

    div.episode-poster img {
        width: 290px;
    }

    div.menu {
        flex-direction: column;
    }

    div.tab:nth-of-type(1) {
        cursor: pointer;
    }

    div.tab:nth-of-type(2) .menu {
        left: -100px;
    }

    div.tab:nth-of-type(3) .menu {
        left: -200px;
    }

    div.tab:nth-of-type(4) .menu {
        left: -300px;
    }


}