
/* ==================================================
   RAMAN TRIKHA
   ORIGINAL DESIGN + UPCOMING FILM MENU

   Desktop: 1350px+
   Compact desktop: 992px–1349px
   Mobile menu: 991px and below
================================================== */


/* ==================================================
   COMMON
================================================== */

.rt-header {
    width: 100%;
    left: 0;
    right: 0;
}

.rt-header .logo img {
    display: block;
    width: 100%;
    max-width: 205px;
    height: auto;
}

.rt-header .mainmenu > nav > ul > li > a {
    font-family: 'Ubuntu', sans-serif;
    font-size: 14px;
    font-weight: 300;
    text-transform: uppercase;
    white-space: nowrap;
}

.rt-header .mainmenu ul.sub-menu li a {
    white-space: normal;
}


/* ==================================================
   LARGE DESKTOP - 1350px AND ABOVE
   Original single-row header
================================================== */

@media (min-width: 1350px) {

    .rt-header > .container {
        width: 96%;
        max-width: 1500px;
    }

    .rt-header .rt-header-row {
        display: flex;
        align-items: flex-start;
    }

    .rt-header .rt-logo-column {
        float: none;
        width: 18%;
        flex: 0 0 18%;
    }

    .rt-header .rt-navigation-column {
        float: none;
        width: 82%;
        flex: 0 0 82%;
    }

    /* Original logo shape */

    .rt-header .logo {
        height: 70px;
        margin-top: 40px;
        padding: 0 12px;
        border-radius: 0 70px 70px 0;
        background: rgba(31, 11, 13, .8);
    }

    .rt-header .logo a {
        display: flex;
        align-items: center;
        height: 70px;
        line-height: normal;
    }

    /* Original rounded navigation */

    .rt-header .menu_icon_wrapper {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;

        height: 70px;
        margin-top: 40px;
        padding: 0 10px 0 15px;

        border-radius: 70px 0 0 70px;
        background: rgba(31, 11, 13, .8);
    }

    /* Prevent old red extension from appearing
       as an isolated vertical stripe */

    .rt-header .menu_icon_wrapper::after {
        content: none;
    }

    /* Social icons: original size */

    .rt-header .header_social_icon {
        position: static;
        float: none;
        display: flex;
        align-items: center;
        flex: 0 0 auto;
        gap: 6px;
        padding: 0;
        margin-right: 8px;
    }

    .rt-header .header_social_icon a {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 40px;
        height: 40px;
        margin: 0;

        font-size: 18px;
    }

    .rt-header .header_social_icon a i {
        line-height: 1;
    }

    /* Menu */

    .rt-header .mainmenu {
        flex: 0 1 auto;
        min-width: 0;
        margin: 0;
        text-align: right;
    }

    .rt-header .mainmenu > nav > ul {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
        margin: 0;
        padding: 0;
    }

    .rt-header .mainmenu > nav > ul > li {
        display: block;
        flex: 0 0 auto;
        float: none;
    }

    .rt-header .mainmenu > nav > ul > li > a {
        display: block;
        padding: 0 10px;
        font-size: 14px;
        line-height: 70px;
    }

    /* Search */

    .rt-header .header_search {
        position: relative;
        top: auto;
        right: auto;
        flex: 0 0 auto;
        margin: 0 0 0 4px;
    }
}


/* ==================================================
   COMPACT DESKTOP - 992px TO 1349px

   Social icons in upper-right.
   Full-size navigation below them.
   No tiny fonts or tiny icons.
================================================== */

@media (min-width: 992px) and (max-width: 1349px) {

    .rt-header > .container {
        width: 98%;
        max-width: none;
    }

    .rt-header .rt-header-row {
        display: flex;
        align-items: flex-start;
    }

    .rt-header .rt-logo-column {
        float: none;
        width: 19%;
        flex: 0 0 19%;
    }

    .rt-header .rt-navigation-column {
        float: none;
        width: 81%;
        flex: 0 0 81%;
    }

    /* Original logo appearance */

    .rt-header .logo {
        height: 70px;
        margin-top: 40px;
        padding: 0 8px;
        border-radius: 0 70px 70px 0;
        background: rgba(31, 11, 13, .8);
    }

    .rt-header .logo a {
        display: flex;
        align-items: center;
        height: 70px;
        line-height: normal;
    }

    .rt-header .logo img {
        max-width: 190px;
    }

    /* Slightly taller navigation bar */

    .rt-header .menu_icon_wrapper {
        position: relative;
        display: flex;
        align-items: flex-end;
        justify-content: flex-end;
        flex-wrap: nowrap;

        height: 96px;
        margin-top: 27px;
        padding: 35px 12px 0 16px;

        border-radius: 48px 0 0 48px;
        background: rgba(31, 11, 13, .9);
    }

    .rt-header .menu_icon_wrapper::after {
        content: none;
    }

    /* Social icons on top-right */

    .rt-header .header_social_icon {
        position: absolute;
        top: 6px;
        right: 16px;

        display: flex;
        align-items: center;
        gap: 6px;

        float: none;
        padding: 0;
        margin: 0;
    }

    .rt-header .header_social_icon a {
        display: flex;
        align-items: center;
        justify-content: center;

        width: 40px;
        height: 40px;
        margin: 0;

        font-size: 18px;
    }

    .rt-header .header_social_icon a i {
        line-height: 1;
    }

    /* Full-size menu */

    .rt-header .mainmenu {
        flex: 0 1 auto;
        min-width: 0;
        margin: 0;
        text-align: right;
    }

    .rt-header .mainmenu > nav > ul {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        flex-wrap: nowrap;
        margin: 0;
        padding: 0;
    }

    .rt-header .mainmenu > nav > ul > li {
        display: block;
        flex: 0 0 auto;
        float: none;
    }

    .rt-header .mainmenu > nav > ul > li > a {
        display: block;
        padding: 0 7px;
        font-size: 14px;
        line-height: 58px;
    }

    /* Search aligned with navigation */

    .rt-header .header_search {
        position: relative;
        top: auto;
        right: auto;
        flex: 0 0 auto;
        margin: 0 0 0 5px;
        align-self: flex-end;
    }
}


/* ==================================================
   TABLET AND MOBILE - 991px AND BELOW

   Keep original MeanMenu.
================================================== */

@media (max-width: 991px) {

    .rt-header > .container {
        width: 100%;
    }

    .rt-header .rt-header-row {
        position: relative;
    }

    .rt-header .logo {
        position: relative;
        z-index: 1001;
    }

    .rt-header .logo img {
        max-width: 175px;
    }

    .rt-header .menu_icon_wrapper::after {
        content: none;
    }

    /* MeanMenu generated navigation */

    .rt-header .mean-container .mean-bar {
        z-index: 1000;
    }

    .rt-header .mean-container .mean-nav {
        background: rgba(31, 11, 13, .98);
    }

    .rt-header .mean-container .mean-nav ul li a {
        color: #fff;
        border-color: rgba(255, 255, 255, .12);
    }

    .rt-header .mean-container a.meanmenu-reveal {
        z-index: 1002;
    }
}
