/*
 * 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
 */


/*
 * Breakpoints
 */
    /* Cinema Display and larger */
    @media (min-width: 1800px) {

        /* Post Grid */

        .post-block .title {
            font-size: 31px;
            word-wrap: break-word;
        }
        .meta .date,
        .meta .location {
            font-size: 19px;
        }
        .meta .year {
            font-size: 16px;
        }
        .post-block .excerpt {
            font-size: 19px;
        }


        /* Project Detail */
        .project-detail .entry {
            font-size: 21px;
        }

        /* Team Grid */
        .team-block .title {
            font-size: 31px;
        }
        .team-block .job-title {
            font-size: 19px;
        }

        /* Team Detail */
        .team-detail .meta .title {
            font-size: 33px;
        }
        .team-detail .meta {
            font-size: 19px;
        }
        .team-detail .excerpt {
            font-size: 31px;
        }
        .team-detail .entry,
        .team-detail .block-text {
            font-size: 21px;
        }
        .follow-text {
            font-size: 18px;
        }

        /* Content Style */
        .content-style .entry {
            font-size: 21px;
        }
        .content-style .entry h3 {
            font-size: 31px;
        }

        /* Single */
        .single .post-block.news-block .excerpt {
            font-size: 21px;
        }

        /* Video Grid */
        .video-grid .post-block .title-wrapper {
            max-width: 67%;
        }

    }

    /* For 'News' galleries */
    @media (min-width: 1280px) {
        .gallery-detail .browse {
            opacity: 1;
        }
        .gallery-detail .arrow-left polygon,
        .gallery-detail .arrow-right polygon {
            fill: #4d4d4d;
        }
    }

    /* Smaller than Desktop HD */
    @media (max-width: 1200px) {

        /* Home */
        .excerpt-wrap .excerpt {
            margin-right: 0;
        }
        .image-block .read-more {
            font-size: 17px;
        }
        .home .block-text {
            padding: 0;
        }

        /* Post Grid */
        .post-block .meta {
            margin: 0 20px 0 0;
        }
        .post-block:nth-child(even) .meta {
            margin: 0 0 0 20px;
        }

        /* News Detail */
        .single .news-block .excerpt {
            margin-left: 70px;
            font-size: 18px;
        }

        /* Project Detail */
        .project-detail .entry {
            margin-top: 45px;
        }
        .image-block {
            margin-top: 45px;
            margin-bottom: 45px;
        }
        .content-style .entry > img {
            margin: 45px auto;
        }

        /* Store */
        .product-block {
            width: 45%;
        }
        .product-grid .excerpt {
            max-height: 365px;
        }
        #content.product-grid {
            padding-top: 450px;
        }

    }

    /* Between tablet and mobile */
    @media (max-width: 1000px) {

        .image-block .about-text {
            font-size: 22px;
            position: relative;
        }
        .image-block .read-more {
            font-size: 15px;
        }

        /* Home */
        .home .block-text {
            padding: 0;
        }
        .home .post-grid {
            margin-top: 50px;
        }
        .latest-news > .title {
            margin-left: 30px;
        }

        /* Post Grid */
        .post-block .title {
            font-size: 20px;
        }
        .post-block .title-wrapper {
            margin-left: 0;
        }
        .video-grid .post-block .title-wrapper {
            margin-left: 0;
            margin-bottom: 45px;
        }
        .video-grid .post-block .excerpt {
            font-size: 15px;
        }
        .post-block .read-more {
            font-size: 15px;
        }

        /* Team Grid */
        .team-block {
            margin: 0 35px 55px 35px;
        }

        /* Team Detail */
        .team-detail .thumbnail {
            margin-bottom: 30px;
        }
        .team-detail .entry p {
            padding-left: 0;
            width: 100%;
        }

        /* News Detail */
        .single .news-block .excerpt {
            font-size: 16px;
            margin-top: 35px;
        }

        /* Product Detail */
        .product .product-info {
            margin: 30px 0;

            -webkit-flex-direction: column;
            flex-direction: column;
        }
        .product .title-wrapper {
            margin: 30px 0;
        }
        .content-style .thumbnail {
            -webkit-order: -1;
            order: -1;
        }

    }

    /* Small vertical viewport */
    @media (max-height: 770px) {

        /* Menu */
        .main-menu {
            bottom: 342px;
        }
        .main-menu li a {
            padding: 5px 0;
        }
        .project-nav .meta {
            margin-top: 25px;
        }
        .project-nav .menu-block {
            width: 300px;
        }
        .project-nav .menu-block > img {
            width: 300px;
            height: auto;
        }

    }


    /* Small vertical viewport */
    @media (max-height: 650px) {

        /* Menu */
        .project-nav {
            display: none;
        }
        .menu-overlay {
            border: none;
        }
        .main-menu {
            font-size: 26px;
            top: 40px;
            bottom: 0;
        }
        .main-menu li a {
            padding: 15px 0;
        }

    }


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

        /* Global */
        #container {
            background-color: inherit;
        }
        .logo-background,
        .menu-overlay .logo-large,
        #header > * {
            display: none;
        }
        #header {
            height: 90px;
            position: fixed;
            top: 0;
        }
        #header .header-wrapper {
            display: block;
        }
        #header .left,
        #header .color-block.left {
            width: 100%;
        }
        #header .right {
            width: 50%;
        }
        .logo-small {
            display: none;
        }
        .logo-mobile {
            display: block;
            z-index: 300;
            position: fixed;
        }
        .hamburger-wrapper {
            right: calc(30px - 20px);
        }
        .menu-opened .hamburger-wrapper {
            position: fixed;
        }
        .hamburger-wrapper > span {
            display: none;
        }
        #content .breadcrumb {
            display: block;
            width: 40%;
            box-sizing: border-box;
            padding-right: 17px;
            padding-left: 30px;
            margin-left: 0;
        }

        /* Menu */
        .logo-large-menu {
            display: none;
        }
        .project-nav {
            display: none;
        }
        .menu-overlay {
            border: none;
        }
        .main-menu {
            font-size: 26px;
            min-height: 400px;
            top: 90px;
            bottom: 40px;
        }
        .main-menu li a {
            padding: 15px 0;
        }

        /* Home */
        .home .slideshow {
            position: relative;
            top: 0;
            margin-top: 90px;
        }
        .home .slideshow .right {
            display: none;
        }
        .home .slideshow .left {
            right: 0;
        }
        .home .slideshow .next-arrow {
            display: none;
        }
        .logo-large,
        .logo-large-text {
            display: none;
        }
        .excerpt-wrap {
            display: none;
        }
        #content.home {
            position: relative;
            top: 0;
        }
        .latest-news {
            padding-top: 0;
        }
        .home-text {
            padding: 70px 0;
        }
        .home-text .entry {
            padding: 0;
        }
        .home-text .entry h2 {
            font-size: 20px;
            margin: 0 30px;
        }
        .home-about {
            padding: 0 0 40px 0;
        }
        .home .image-block {
            padding-left: 30px;
            padding-right: 30px;
        }
        .image-block .block-text {
            padding-left: 0;
            padding-right: 0;
        }
        .image-block .about-text {
            font-size: 20px;
            position: relative;
        }

        /* Post Grid */
        .post-grid {
            margin-top: 95px;
            padding: 0 30px;
        }
        .post-block {
            flex-flow: column;
            padding-bottom: 55px;
        }
        .post-block .thumbnail,
        .post-block:nth-child(even) .thumbnail {
            width: 100%;
            order: 1;
        }
        .post-block .meta,
        .post-block:nth-child(even) .meta {
            order: 2;
            margin: 20px 0 0 0;
        }
        .post-block .title-wrapper {
            float: left;
            margin: 0;
            width: calc(46% - 20px);
        }
        .post-block .title {
            font-size: 18px;
        }
        .meta .date,
        .meta .location,
        .meta .year {
            font-size: 14px;
        }
        .post-block .excerpt {
            font-size: 13px;
            float: right;
            width: 54%;
        }
        .news-block {
            margin: 0;
        }
        .post-block .read-more {
            font-size: 14px;
        }

        /* Project Detail */
        .page-browse {
            display: none;
        }
        .project-detail > div {
            margin: 105px auto 90px auto;
        }
        .project-detail .thumbnail {
            padding: 0;
            width: auto;
            clear: both;
            margin: 0 30px;
        }
        .project-detail .meta {
            padding-left: 0;
            width: 60%;
            float: right;
            box-sizing: border-box;
            padding-right: 30px;
        }
        .project-detail .entry {
            font-size: 15px;
        }

        /* Content Styles */
        .content-style .entry {
            margin-top: 30px;
        }
        .content-style .entry > * {
            padding-left: 30px;
            padding-right: 30px;
        }
        .content-style .entry h3 {
            font-size: 20px;
            margin: 40px auto;
        }
        .content-style .entry > img {
            margin: 30px auto;
            max-width: calc(100% - 30px - 30px);
        }

        /* Image Block */
        .image-block {
            margin: 30px auto 30px auto;
            flex-flow: column;
        }
        .image-block .left-image {
            width: 100%;
            margin: 0 0 30px 0;
        }
        .image-block .right-image {
            width: 100%;
            margin: 0;
        }
        .image-block .block-text {
            width: 100%;
            margin: 30px 0;
            font-size: 16px;
        }
        .team-detail .image-block {
            padding: 30px 0;
        }
        .follow-text {
            margin-top: 0;
        }

        /* Category (Publications, News, Video) */
        #content.category {
            margin: 95px auto 90px auto;
            padding: 0 30px;
        }


        /* Single (Latest News) */
        #content.single {
            margin: 95px auto 90px auto;
            padding: 0;
        }
        .single .news-block {
            padding: 0 30px;
        }
        .single .news-block .meta {
            order: 1;
        }
        .single #content .breadcrumb {
            padding-left: 0;
            margin-left: 0;
            padding-right: 20px;
            box-sizing: border-box;
        }
        .single .news-block .title-wrapper {
            padding-left: 0;
            font-size: 16px;
            width: 60%;
        }
        .single .news-block .excerpt {
            width: 100%;
            max-width: 100%;
            margin-top: 0;
            padding: 25px 0 0 0;
        }
        .single .thumbnail {
            margin-top: 30px;
        }

        /* Team Grid */
        #content.team-grid {
            padding: 95px 30px 0 30px;
        }
        .team-block {
            margin: 0 0 55px 0;
            width: 100%;
        }
        .team-block img {
            width: 100%;
            height: auto;
        }

        /* Team Detail */
        #content.team-detail {
            margin: 125px auto 90px auto;
            padding: 0 30px;
        }
        .team-detail .meta {
            display: block;
            margin-bottom: 0;
            margin-left: 0;
        }
        .team-detail .excerpt {
            display: block;
            width: 100%;
            margin: 0;
        }
        .team-detail .thumbnail {
            float: none;
            width: 100%;
            margin: 30px auto;
        }
        .team-block .job-title {
            margin-left: 0;
        }
        .team-detail .entry > p,
        .team-detail .entry p:first-child {
            margin: 0;
            max-width: 100%;

        }

        /* About */
        #content.about {
            margin: 125px auto 90px auto;
        }
        .gallery-detail {
            margin: 30px 0;
            height: auto;
            min-height: 0;
        }
        .gallery-detail .gallery-image img {
            width: 100%;
            height: auto;
            opacity: 0;
            display: block;
        }
        .about-block .thumbnail {
            width: 100%;
            height: auto;
            box-sizing: border-box;
        }

        /* Video */
        .video-block {
            margin-bottom: 0;
        }
        .video-block .video {
            width: 100%;
        }
        .video-block .overlay {
            opacity: 1;
        }

        /* Contact */
        #content.contact {
            margin: 95px auto 90px auto;
            padding: 0 30px;
        }
        .contact .slideshow {
            position: relative;
            width: 100%;
            left: auto;
            top: auto;
            display: block;
            width: 100%;
            height: 50vh;
        }
        .contact .entry {
            margin-top: 30px;
            padding: 0;
            bottom: auto;
            position: relative;
            right: auto;
        }
        .contact .map {
            margin-bottom: 0;
        }

        /* Shop - All */
        .store-breadcrumb {
            padding-right: 25%;
            margin-top: 36px;
        }

        /* Shop - Product Grid */
        #content.product-grid {
            padding: 100px 30px;
        }
        .product-block {
            width: 100%;
            padding: 0;
            margin: 10px 0;
        }
        .product-block h3 {
            min-height: 0;
        }
        .product-grid .excerpt {
            position: static;
            max-width: 100%;
        }

        /* Shop - Product Detail */
        #content.product {
            padding-top: 100px;
        }
        .content-style .thumbnail {
            width: 100%;
        }
        .product .product-info {
            padding: 0 30px;
        }
        .product .product-info .add-to-cart {
            margin: 0;
        }
        .product .description {
            margin: 20px 0;
        }


    }