/*
 * Mobile styles & Breakpoints
 * By Funkhaus - 2014
 * www.funkhaus.us
 *
 */


/*
 * Globals
 */
    .is-mobile #content {

    }


/*
 * Mobile Menu
 */


/*
 * Breakpoints
 */
    /* Cinema Display and larger */
    @media (min-width: 1800px) {
        .project-block {
            padding-bottom: 14.06%;
            width: 25%;
        }
        .category .block-sizer,
        .category .post-block {
            width: 25%;
        }
    }

    /* Smaller than Desktop HD */
    @media (max-width: 1200px) {
        .home-block {
            padding-bottom: 28%;
            width: 50%;
        }
        .project-block {
            padding-bottom: 28%;
            width: 50%;
        }
        .category .block-sizer,
        .category .post-block {
            width: 50%;
        }
        .is-mobile .case-footer .counter {
            display: none;
        }
    }

    @media (max-height: 640px) {
        .contact .connect {
            display: none;
        }
    }

    /* Smaller than tablet */
    @media (max-width: 950px) {
        body.menu-opened {
            overflow: hidden;
        }
        /* Main Menu */
        #main-menu {
            display: none;
        }
        .main-menu {
            height: auto;
        }
        #mobile-menu {
            position: fixed;
            display: block;
            z-index: 120;
            width: 100%;
            left: 0;
        }
        #mobile-menu ul {
            position: relative;
            text-align: center;
            padding-bottom: 10px;
            padding: 20px 0;
        }
        #mobile-menu .menu li {
            display: block;
            font-size: 20px;
        }
        #mobile-menu .sub-menu {
            background: #000;
        }
        #mobile-menu .sub-menu a {
            color: #fff;
        }
        #mobile-menu .menu .current-menu-item a,
        #mobile-menu .sub-menu .current-page-ancestor a {
            border: none;
        }
        #mobile-menu #mobile-main-menu {
            padding-bottom: 45px;
            padding-top: 100px;
            width: 100%;
        }
        #mobile-menu .close {
            position: absolute;
            cursor: pointer;
            margin: auto;
            height: 20px;
            width: 20px;
            right: 0;
            left: 0;
            top: 40px;
        }
        #mobile-menu .close .svg {
            height: 20px;
            width: 20px;
        }

        .home-about .logos .logo-block {
            width: 33.33%;
        }
        .home-block {
            padding-bottom: 56.25%;
            width: 100%;
        }

        .category .block-sizer,
        .category .post-block {
            width: 100%;
        }

        .page-title {
            padding-top: 60px;
            z-index: 1;
        }
        .the-team .page-title .sub-menu,
        .the-team .page-title h3 {
            display: none;
        }
        .page-title,
        .director-detail .page-title {
            right: 20px;
            left: 20px;
        }
        .biography .page-title {
            left: 0;
        }
        .biography #header {
            background: #fff;
        }
        .directors-grid .page-title,
        .project-grid .page-title {
            padding-top: 60px;
            padding-right: 0;
            padding-left: 0;
        }
        #content.project-grid .page-title .sub-menu,
        #content.directors-grid .page-title .sub-menu {
            display: none;
        }
        .page-title select {
            border: 1px solid #fff;

            -webkit-appearance: none;
            background: none;
            background-image: url('../images/icon-drop-arrow-white.svg');
            background-position: 97% 11px;
            background-repeat: no-repeat;
            background-size: 12px;
            cursor: pointer;
            display: block;
            padding: 5px 10px;
            border-radius: 0;
            font-size: 18px;
            width: 100%;
            color: #fff;
        }
        .about #header,
        .about .page-title,
        .team-member #header,
        .team-member .page-title {
            background: #ebebeb;
        }
        .about-team .page-title select,
        .about-us .page-title select {
            background-image: url('../images/icon-drop-arrow.svg');
            border-color: #000;
            color: #000;
        }
        .director-details section,
        .contact section {
            height: auto;
            min-height: 100vh;
        }

        #content.home,
        #content.directors-grid {
            height: auto;
            min-height: 100vh;
            padding-top: 90px;
        }
        .slide-block,
        .directors-grid .slide-block {
            height: auto;
            padding: 35px 0;
            width: 100%;
        }
        .page-title h3 {
            display: none;
        }
        .director-detail .page-title h3 {
            display: block;
        }
        #content.player-page .video {
            overflow: hidden;
            bottom: 20px;
            right: 20px;
            left: 20px;
            top: 20px;
        }

        .home .slide-grid {
            position: static;
        }
        .home .down-button {
            display: none;
        }
        .home .slideshow {
            display: none;
        }
        .address-block .info {
            display: -webkit-flex;
            display: flex;
            -webkit-flex-direction: column;
            flex-direction: column;
        }
        .address-block .info > div {
            margin: 20px auto;
            width: 100%;
        }

        /* re-order footer sections */
        .address-block .info .general {
            order: 0;
        }
        .address-block .info .ny {
            order: 1;
        }
        .address-block .info .la {
            order: 2;
        }

        /* Project Grid */
        .project-block {
            padding-bottom: 56.25%;
            width: 100%;
        }
        #content.project-grid {
            padding: 0 20px;
            padding-top: 110px;
        }
        .project-block .inner-wrap {
            bottom: 0;
            right: 0;
            left: 0;
            top: 0;
        }
        .project-block .overlay {
            background: transparent;
            opacity: 1;
        }
        .project-block .buttons {
            padding: 15px;
        }
        .project-block .buttons a,
        .project-block .buttons div {
            font-size: 12px;
        }
        .project-block .buttons {
            top: 0;
        }
        .project-block .buttons .view {
            position: absolute;
            z-index: 10;
            opacity: 0;
            bottom: 0;
            right: 0;
            left: 0;
            top: 0;
        }
        .project-block .buttons .play {
            display: none;
        }
        .project-block .meta {
            font-size: 12px;
        }
        .project-block .meta .title {
            font-size: 18px;
        }
        .project-block .play,
        .project-block .close,
        .project-block .view {
            padding-top: 4px;
        }

        /* Project Detail */
        .director-details .page-title {
            position: absolute;
        }
        .director-details .browse {
            display: none;
        }
        .director-details .video-embed {
            right: 30px;
            left: 30px;
        }
        .gallery-image .image,
        .gallery-image .video {
            bottom: 30px;
            right: 30px;
            left: 30px;
            top: 30px;
        }
        .gallery-image .image .caption {
            margin-top: -10px;
            padding-top: 0;
        }
        .bio .entry,
        .the-team .entry {
            font-size: 12px;
            padding: 75px 20px;
        }
        section .entry {
            font-size: 12px;
            padding: 0 50px;
        }
        section.gallery .gallery-controls {
            display: none;
        }
        .case-footer .counter {
            display: none !important;
        }
        .case-footer .icon,
        .bio .page-title h3 {
            display: block;
        }
        .the-team .page-title,
        .bio .page-title {
            margin-bottom: 25px;
        }
        .bio .image,
        .the-team .image {
            display: none;
        }
        .bio .text,
        .the-team .text {
            display: block;
            width: 100%;
        }
        .biography .case-footer .close-icon {
            display: inline-block;
        }

        #content.bio {
            padding-top: 60px;
            padding-bottom: 40px;
        }
        #content.the-team {
            padding-top: 100px;
            padding-bottom: 40px;
        }
        .the-team .page-title {
            background: #ebebeb;
            padding-bottom: 0;
        }
        .thumb-tray .thumb-wrap:hover .thumb-block.active,
        .thumb-tray .thumb-block {
            opacity: 1;
        }
        .bio .text,
        .the-team .text {
            min-height: 0;
        }
        .bio .text, .the-team .text {
            position: relative;
            float: none;
        }
        .bio .entry, .the-team .entry {
            padding-bottom: 0;
            padding-top: 0;
        }
        .biography .page-title {
            position: relative;
            padding-top: 0;
        }

        .category .post-block:hover .inner-block {
            border-color: transparent;
        }
        .category .page-title {
            position: absolute;
        }

        .contact .contact-block,
        .contact .contact-block.qt {
            width: 100%;
        }
        .contact .contact-title .left {
            display: none;
        }
        .contact .contact-title .right {
            position: relative;
            text-align: center;
            background: #fff;
            padding: 10px 0;
        }
        .contact .case-footer {
            display: none;
        }
        .contact section:first-of-type .entry {
            padding-top: 40px;
        }
        .about .slides {
            display: none;
        }
        .about .team-menu {
            display: none;
        }
        .about .text {
            width: 100%;
        }
        .about .entry {
            padding-top: 120px;
        }
        .text.single-member {
            display: none;
        }
        #content.single {
            padding-top: 50px;
            min-height: 100vh;
        }
        .single .left .video.fitvids {
            margin: 0 30px;
        }
        #content.single .left,
        #content.single .right {
            padding: 30px 0;
            width: 100%;
            height: auto;
        }
        #content.single .border {
            display: none;
        }
        #content.single .left {
            padding: 0;
            padding-top: 30px;
        }
        .single .left .photos {
            min-width: 100%;
            left: 0;
        }
        .single .left .photo-wrap {
            height: auto;
        }
        .single .left .photo {
            position: relative;
            bottom: auto;
            right: auto;
            left: auto;
            top: auto;
            background-image: none !important;
            padding: 0 30px;
        }
        .single .left .photo img {
            display: inline-block;
            height: auto;
            width: 100%;
        }
        .contact .entry .connect {
            display: none;
        }

        section.bio {
            display: -webkit-flex;
            display: flex;
        }
        section.bio .text {
            margin: auto;
        }
        section.bio .entry {
            padding: 75px;
        }
    }
    @media (max-width: 750px) and (orientation: landscape) {
        .director-details .browse {
            display: block;
        }
        .director-details .video-embed {
            bottom: 50px;
            top: 120px;
        }
    }