/*
* Talamone (HTML)
* Copyright 2014, Limitless LLC
* www.limitless.company
*/


/* Table of Content
==================================================
	#Site Styles
	#Page Styles
	#Media Queries
	#Font-Face */

/* #Site Styles
================================================== */


/* #Page Styles
================================================== */


/* #Media Queries
================================================== */

/* Smaller than standard 960 (devices and browsers) */
@media only screen and (max-width: 959px) {

    /* #Home
		================================================== */

    .home .title {
        font-size: 60px;
        line-height: 84px;
        margin-bottom: 20px;
    }

    .home .subtitle {
        font-size: 15px;
        font-weight: 400;
        letter-spacing: 0.1em;
        margin-bottom: 30px;
    }

    .flex-direction-nav .flex-prev {
        left: 5px !important;
    }

    .flex-direction-nav .flex-next {
        right: 5px !important;
    }

    /* #About
		================================================== */

    .about .image {
        height: 407px;
        width: 364px !important;
    }

    .about .story {
        height: 407px;
        padding: 30px 20px;
        width: 364px !important;
    }

        .about .story .title {
            margin-bottom: 10px;
        }

        .about .story p {
            line-height: 24px;
        }

    /* #Team
		================================================== */

    .team .row {
        margin-bottom: 20px;
    }

    /* #Gallery
		================================================== */

    section.gallery .image.half {
        width: 374px;
    }

    /* #Works
		================================================== */

    .works .filter li {
    }

    .works .row {
        margin-bottom: 20px;
    }

    .works .project .thumbnail, .works .project img {
    }

    /* #Project
		================================================== */

    section.project .image.half {
    }

    section.project .social .facebook {
        margin-right: 20px;
    }

    section.project .links .all {
        margin-left: 10px;
    }

    section.project .social {
        margin-right: 10px;
    }


    /* #Services
		================================================== */

    .services .service .info .text {
        line-height: 24px;
        margin-top: 10px;
    }

    /* #Blog
		================================================== */

    .blog .col-1 .post {
        padding-right: 0px;
    }

    .blog .col-2 .post {
        padding-left: 0px;
    }

    .blog .post, .blog .post:last-child {
        margin-bottom: 20px;
    }

        .blog .post .thumbnail, .blog .post .thumbnail img {
        }

        .blog .post .info {
            padding: 15px 20px;
        }

    /* #Article
		================================================== */

    section.article .social .facebook {
        margin-right: 20px;
    }

    section.article .links .all {
        margin-left: 10px;
    }

    section.article .social {
        margin-right: 10px;
    }

    section.article .info .thumbnail {
        margin-bottom: 30px;
        margin-top: 20px;
    }

    section.article .content {
        margin-bottom: 40px;
    }

        section.article .content p {
            padding: 0px 20px;
        }

    /* #Contact
		================================================== */

    .contact .image, .contact .image img {
    }

    .contact .content {
        padding-left: 20px;
        padding-right: 20px;
    }

    .contact .info {
        margin-bottom: 20px;
    }

        .contact .info .title {
            margin-bottom: 10px;
        }

    .contact .form .title {
        margin-bottom: 10px;
    }
}

/* Tablet Portrait size to standard 960 (devices and browsers) */
@media only screen and (min-width: 768px) and (max-width: 959px) {

    /* #Header
		================================================== */
    header.header .logo-container {
        width: 110px !important;
    }

    /* #About
		================================================== */

    section.about .image {
        display: none;
    }

    section.about .story {
        height: 100%;
        width: 748px !important;
    }

    /* #Works
		================================================== */

    .works .filter li {
        margin-right: 30px;
    }

    .works .row {
        margin-bottom: 20px;
    }

    .works .project .thumbnail, .works .project img {
        height: 236px;
        width: 236px;
    }

    /* #Project
		================================================== */

    section.project .image.half {
        width: 374px;
    }

    section.project .social .facebook {
        margin-right: 20px;
    }

    section.project .links .all {
        margin-left: 10px;
    }

    section.project .social {
        margin-right: 10px;
    }


    /* #Services
		================================================== */
    .services .service {
        text-align: center;
    }

        .services .service .image {
            width: 100% !important;
            margin: 0 auto;
        }

            .services .service .image img {
                width: 470px !important;
            }

        .services .service .info {
            background-color: #f0f0f0 !important;
            width: 100% !important;
            margin: 0 auto;
            text-align: center !important;
        }

            .services .service .info .content {
                background-color: #ffffff;
                height: 470px;
                padding: 60px 40px 0 40px;
                width: 470px;
                display: inline-block;
                text-align: left;
                top: 0 !important;
            }

    /* #Blog
		================================================== */

    .blog .post .thumbnail, .blog .post .thumbnail img {
        height: 196px !important;
        width: 349px !important;
    }

    /* #Contact
		================================================== */

    .contact .image, .contact .image img {
        height: 425px;
        width: 364px !important;
    }
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 767px) {

    .offset {
        padding: 30px 0px 0px;
    }


    /* #.header
		================================================== */

    header.header {
    }

        header.header.active {
            background-color: #d0d0d0 !important;
            height: auto;
            bottom: 0px;
        }

        header.header .logo {
            float: left;
            width: 50%;
        }

        header.header .menu {
            display: block;
        }

        header.header .navigation, header.header .language-selection {
            display: none;
        }

        header.header.active .navigation, header.header.active .language-selection {
            display: block;
            text-align: center;
        }

        header.header .navigation ul {
            display: block;
        }

        header.header .navigation li {
            font-size: 20px;
            display: block;
            margin: 0px auto 25px;
            padding: 0px 5px;
            text-align: center;
        }

        header.header .language-selection li:first-child {
            margin-left: -5px;
        }

        header.header .navigation li:last-child {
            margin: 0px auto 0px;
        }


    /* #Home
		================================================== */

    section.home {
    }

        section.home .title {
            font-size: 40px;
            line-height: 48px;
            margin-bottom: 15px;
        }

        section.home .subtitle {
            font-size: 15px;
            font-weight: 400;
        }

        section.home .buttons {
            bottom: 0px;
        }

        section.home .discover, section.home .watch {
            bottom: 25px;
        }

        section.home .watch {
            left: 0px;
        }

        section.home .discover {
            background-image: url(../img/misc/home-discover-mobile.png);
            background-position: right 2px;
            background-size: 8px 17px;
            left: auto;
            margin-top: 4px;
            opacity: 0.4;
            padding-right: 15px;
            right: 0px;
            text-align: left;
            height: 82px;
            width: 300px;
            background-repeat: no-repeat;
        }

    /* #About
		================================================== */

    section.about .image {
        display: none;
    }

    section.about .story {
        height: auto !important;
        text-align: center;
        width: 420px !important;
    }

    /* #Team
		================================================== */

    section.team .member {
        margin-bottom: 50px;
    }

        section.team .member:last-child {
            margin-bottom: 0px;
        }


    /* #Gallery
		================================================== */

    section.gallery .container {
        padding: 0px;
    }

    section.gallery .image, section.gallery .image.half {
        width: 300px;
    }


    /* #Facts
		================================================== */

    section.facts {
    }

        section.facts .fact {
            margin-bottom: 20px;
            text-align: center;
        }

            section.facts .fact:last-child {
                margin-bottom: 0px;
            }

    /* #Works
		================================================== */

    .works .filter li {
        margin-right: 30px;
    }

    .works .row {
        margin-bottom: 0px;
    }

    .works .project {
        margin-bottom: 10px;
    }

        .works .project .thumbnail, .works .project img {
            height: 300px;
            width: 300px;
        }

    /* #Project
		================================================== */

    section.project .offset {
        padding-top: 100px !important;
    }

    section.project .info p {
        padding: 0px 20px;
    }

    section.project .gallery .container {
        padding: 0px;
    }

    section.project .image.half {
        width: 300px;
    }

    section.project .social .facebook {
        margin-right: 20px;
    }

    section.project .links {
        text-align: center;
    }

        section.project .links .all {
            margin-left: 10px;
        }

    section.project .social {
        margin-right: 10px;
        margin-top: 20px;
        text-align: center;
    }


    /* #Services
		================================================== */

    .services {
    }

        .services .filter li {
            margin-right: 20px;
        }

        .services .service .image {
            display: none;
        }

        .services .service .info {
            height: 420px !important;
            margin-left: 0px !important;
            padding: 30px !important;
            text-align: center;
            width: 420px !important;
        }

            .services .service .info .text {
                margin-top: 30px;
            }

    /* #Blog
		================================================== */

    .blog .post .thumbnail, .blog .post .thumbnail img {
        height: 228px !important;
        width: 405px !important;
    }

    /* #Article
		================================================== */

    section.article .social .facebook {
        margin-right: 20px;
    }

    section.article .links {
        text-align: center;
        width: 300px;
    }

        section.article .links .all {
            margin-left: 10px;
        }

    section.article .social {
        margin-top: 20px;
        text-align: center;
    }

    /* #contact
		================================================== */

    section.contact .map {
        height: 200px;
        width: 300px !important;
    }

    section.contact .content {
        margin-bottom: 100px;
        /*margin-top: -100px;*/
    }

    section.contact .info {
        height: auto !important;
        padding: 30px;
        text-align: center;
        width: 100% !important;
    }

        section.contact .info .title {
            line-height: 36px;
        }

        section.contact .info .text {
            margin-bottom: 20px;
        }

        section.contact .info .link {
            background-image: none;
            padding: 0px;
        }

    section.contact .form {
        height: auto;
        text-align: center;
    }

    /* #Footer
		================================================== */

    footer.footer {
        margin-top: 30px;
    }

        footer.footer .copyright {
            background-position: center top;
            margin-top: 0px;
            text-align: center;
        }

        footer.footer .social {
            margin-top: 20px;
            text-align: center;
        }
}

/* Mobile Landscape Size to Tablet Portrait (devices and browsers) */
@media only screen and (min-width: 480px) and (max-width: 767px) {
}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 479px) {

    section.works .filter li {
        margin-right: 30px;
    }

    /* #About
    ================================================== */

    section.about .story {
        width: 300px !important;
    }

    section.education .school .title {
        padding-left: 0;
        background-image: none !important;
    }

    /* #Services
    ================================================== */

    section.services .filter li
    {
        margin: 0 10px;
    }

    .services .service .info {
        height: 550px !important;
        width: 300px !important;
    }

    /* #Blog
    ================================================== */

    .blog .post .thumbnail, .blog .post .thumbnail img {
        height: 160px !important;
        width: 285px !important;
    }

    /*
        #Footer
    ================================================== */

    footer.footer .privacypolicy{
        float:none;
    }
}
