/*
 * Mobile styles & Breakpoints
 * By Funkhaus - 2016
 * www.funkhaus.us
 *
 * @see https://www.emailonacid.com/blog/article/email-development/emailology_media_queries_demystified_min-width_and_max-width
 * (min-width: 1800px) == Greater than or equal to 1800px
 * (max-width: 750px) == Less than or equal to 750px
 *
 */

/*
 * Globals
 */
body.is-mobie.menu-opened {
    overflow: hidden;
}

/*
 * Breakpoints
 */
/* Cinema Display and larger */
@media (min-width: 1800px) {
    /* Work Grid */
    .work-block {
        width: calc(33.33% - 20px);
    }

    /* About */
    .press-block {
        width: 25%;
    }
}

/* Smaller than tablet */
@media (max-width: 1024px) {
	/* News Grid & Blocks */
	.grid-sizer {
		width: 100%;
	}	 
	.gutter-sizer {
		width: 0;
	}   
    .block-news,
    .block-news:nth-child(3n) {
	    width: 100%;
	    padding: 0;
    }
}

/* Smaller than tablet */
@media (max-width: 750px) {
    /* Global */
    body {
        font-size: 14px;
    }
    #content {
        margin: 70px 20px;
    }
    .bouncing-mouse {
        display: none;
    }

    /* Header */
    .header,
    .scrolled-down .header {
        height: 65px;
    }
    .logo-text {
        top: 28px;
        right: 60px;
    }
    .logo-text .svg {
        height: 18px;
        width: 132.683px;
    }
    .hamburger {
        top: 10px;
        right: 0px;
    }
    .logo-mark {
        bottom: 20px;
        right: 20px;
    }
    .logo-mark .svg {
        width: 21px;
        height: 30.23px;
    }
    .breadcrumb {
        left: 20px;
        top: 27px;
    }
    .breadcrumb .secondary {
        display: none;
    }

    /* Menu */
    .main-menu {
        padding: 50px 20px;
        font-size: 34px;
    }
    .main-menu li {
        display: block;
    }
    .social-links {
        bottom: 20px;
        left: 20px;
        font-size: 13px;
    }
    .social-links .newsletter,
    .social-links br {
        display: block;
    }
    .social-links .newsletter.active input {
        width: 160px;
    }
    
    /* News Grid & Blocks */
    .grid-news {
	    margin: 50px 20px 0 20px;
    }
	.grid-sizer {
		width: 100%;
	}	 
	.gutter-sizer {
		width: 0;
	}   
    .block-news,
    .block-news:nth-child(3n) {
	    width: 100%;
	    padding: 0;
	    margin-bottom: 50px;
    }
    
    /* Takeover */
    .takeover .title {
        font-size: 30px;
    }

    /* Home */
	.section-work-grid {
        margin-left: 20px;
        margin-right: 20px;		
	}
	#content.home-page .work-block {
		display: block;
		margin-bottom: 10px;
		width: 100%;
	}	
	
	.section-directors-list {
		padding: 100px 0;		
	}	

    /* Directors List */
    .directors-menu {
        right: 40px;
        font-size: 30px;
    }
    .directors-slideshow {
        display: none;
    }

    /* Work Grid */
    #content.work-grid {
        margin-top: 70px;
        margin-left: 20px;
        margin-right: 20px;
    }
    .video-playing #content.work-grid {
        margin-top: 70px;
    }
    .work-grid .grid {
        margin-bottom: 20px;
    }
    .work-grid .page-title {
        margin: 0 0 20px 0;
        font-size: 26px;
    }
    .work-block {
        width: 100%;
        margin: 0 0 10px 0;
    }
    .work-block .title {
        font-size: 16px;
        padding: 20px;
    }
    .work-block .title .line-1 {
        -webkit-transform: none;
        transform: none;
        font-size: 18px;
    }
    .work-block .title .line-2 {
        opacity: 1;
        -webkit-transform: none;
        transform: none;
        margin-top: 5px;
    }
    .work-block .credit {
        -webkit-transform: none;
        transform: none;
        left: 20px;
        bottom: 20px;
        opacity: 1;
        font-size: 12px;
    }

    /* About section */
    .about-section {
        margin: 20px 0;
    }
    .about-section .title {
        font-size: 26px;
        margin: 20px 0;
    }
    .about-section .entry > p {
        margin-left: 0;
        margin-right: 0;
    }

    /* Video Detail */
    .video-player {
        margin: 0;
        position: relative;
        padding-bottom: 50px;
    }
    .video-player iframe {
        margin: auto;
    }
    .video-player .meta {
        padding: 20px;
    }
    .video-player .meta > * {
        margin-bottom: 10px;
        padding-right: 0;
        float: none;
        display: block;
    }
    .video-player .close {
        top: auto;
        right: auto;
        left: 50%;
        bottom: 10px;
        position: absolute;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
    }
    .video-player .has-excerpt .excerpt {
        float: none;
        width: 100%;
    }

    /* Category */
    #content.category {
        margin: 70px 20px;
    }
    .post-block .thumbnail {
        margin-bottom: 20px;
    }
    .post-block .box {
        float: none;
    }
    .post-block .date {
        float: none;
        margin: 20px 0 10px 0;
    }
    .post-block .text {
        width: 100%;
        float: none;
    }

    /* Fallback (Single) */
    #content.fallback {
        margin: 70px 20px;
    }
    .fallback .title {
        margin: 20px 0;
        font-size: 24px;
    }
    .fallback .thumbnail {
        margin-bottom: 20px;
    }
    .fallback .date {
        float: none;
        margin: 20px 0;
    }
    .fallback .entry {
        float: none;
        width: 100%;
    }
    .next-preview {
        padding: 40px 20px;
    }
    .next-preview .title {
        font-size: 18px;
    }

    /* Contact */
    #content.contact {
        margin-top: 100px;
    }
    .contact .entry {
        margin: 70px 20px;
    }
    .contact .entry li {
        padding-right: 0;
        width: 100%;
    }
    .contact .office-grid {
        margin: 40px 0;
    }
    .contact .office-image {
        display: block;
        width: 100%;
        height: 0;
        padding-bottom: 56.25%;
        position: relative;
    }
    .contact .office-image img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .contact .office-block {
        margin: 40px 20px;
    }
    .contact .legal {
        margin-left: 20px;
        margin-right: 20px;
    }
    .funkhaus {
        position: static;
        display: block;
        margin: 20px;
    }

    /* About */
    .about-slideshow .caption {
        left: 20px;
        font-size: 14px;
    }
    .about-slideshow .slide h2 {
        font-size: 18px;
    }
    .about .section {
        margin: 50px 20px;
    }
    .section-clients .logo-grid {
        margin-left: 0;
    }
    .section-clients .logo-block {
        margin: 25px;
    }
    .press-block {
        padding: 0 0 40px 0;
        width: 100%;
    }
    .press-block .date {
        margin-bottom: 10px;
    }

    /* Takeover Logo */
    .takeover-single .logo-white {
        width: 100%;
    }
}

/* Smaller than tablet and landscape */
@media (max-width: 750px) and (orientation: landscape) {
}

.menu-opened .menu-panel,
.menu-panel {
    -apple-clip-path: none;
}