@media only screen and (max-width: 1200px) {
    .page-header h2,
    .page-header p{
        padding-left: 0; 
        text-align: center;
        width: 100%;
        max-width: inherit;
    }
    .page-header h2{
        padding-top: 100px;
    }
    .page-header{
        min-height: inherit;
        padding-bottom: 140px;
    }
    
    
}

@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px)  {
    .hero{ height: 600px !important; background-size: cover;}
    .work .hero{ height: 430px !important;}
    #scroll-down{display: none !important;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .section {padding: 50px 0 !important;}
}

@media only screen 
  and (min-device-width: 1024px) 
  and (max-device-width: 1366px){
    .hero{ height: 600px !important; background-size: cover;}
    .work .hero{ height: 430px !important;}
    .section {padding: 200px 0 !important;}
    #scroll-down{display: none !important;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 1366px) 
  and (max-device-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
    .section {padding: 200px 0 !important;}
}

/* Landscape */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
    .section {
        padding: 250px 0 !important;
    }
}

/* Landscape */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
    .section {
        padding: 250px 0 !important;
    }
}

@media only screen and (max-width: 768px) {
    /* Resets */
    .header{
        height: 43px; 
        padding: 15px 0;
        /* background-color: #000000; */
    }
    .hero {
        background-attachment:scroll;
        background-position-y:0px!important;
        background-position: center center;
        /* height: 215px; */
        /* margin-top: 73px; */
    }
    .home .hero{height: 100vh;}
    .work .hero{margin-top: 73px;
        background-attachment: inherit;
    }
    .mimic {
        background-position:25.2% center;
    }
    .logo{
        margin-top: 0px; 
        margin-left: 0; 
        left: 0;
        text-align: left;
    }
    .bg-headbar .logo{
        margin-top: 0;
    }
    .logo img{
        width: 90px;
        margin-left: 15px;
    }
    .grow {
        -moz-transform: scale(1, 1)!important;
        -webkit-transform: scale(1, 1)!important;
        transform: scale(1, 1)!important;
    }

    .page-header {
        width:90%;
        padding-bottom: 35px;
    }
    .grid-hero {
        float:left; 
        width:100%; 
        padding-bottom:75%;
    }
    .grid-hero:after, 
    .grid-hero:hover:after {
        opacity:0.2;
    }
    .grid-item, 
    .item {
        width:100%; 
        padding-bottom:75%; 
    }
    .grid-item:after, 
    .grid-item:hover:after {
        opacity:0.2;
    }
    .grid-hero:before,
    .grid-item:before{
        width: 50px;
    }
    .grid-hero:hover:before, 
    .grid-item:hover:before, 
    .grid-item:active:before, 
    .grid-hero:active:before{
        width: 100px;
    }
    .grid-copy {
        width:100%;
    }
    .masonry-item {
        width:100%; 
        padding-bottom:75%;
    }
    .tall {
        width:100%; 
        padding-bottom:150%;
    }
    .page-header p {
        width:100%;
    }
    .about-page-header {
        padding-bottom:35px; 
        width:90%; 
        margin-left:auto; 
        margin-right:auto;
    }
    .previous {
        display:none;
    }
    .next {
        display:none;
    }
    h2.name {
        text-align:left; 
        margin-bottom:20px; 
        margin-top:0px; 
        font-size:36px;
    }
    h3.contact-header:first-child {
        margin-top:20px;
    }
    .contact-social-icons{padding-top: 0;position: absolute;bottom: -15.2em;}
    .main-container.contact .hero{height: 100vh;}
    .work #scroll-down{ display: none;}
    #scroll-down{display: none;}
    /* .section-contact{padding-bottom: 0 !important;} */
    h2.bottom-link{
        font-size: 30px;
    }
    .client-logos img {
        width:33.33%; 
        height:auto; 
        float:left;
    }
    .copyright {
        position:relative; 
        float:left; 
        width:100%; 
        left:0; 
        margin-left:0; 
        margin-bottom: 10px;
    }
    .copyright p {
        font-size:14px; 
        text-align: center;
    }
    .footer-social-icons {
        width:100%; 
        float:left; 
        margin-left:0; 
        position: relative; 
        top: 0; 
        right: 0;
        text-align: center;
    }
    .work-nav{
        font-size: 16px;
        position: static;
        padding-top: 45px;
        line-height: 22px;
    }
    .contact .page-header h2{
        padding-top: 30vh;
        font-size: 40px;
    }
    .contact-map{height: 350px;margin-bottom: 35px;margin-top: 45px;}
    
    .services-list .column{
        width: 100%;
        margin-left: 0;
    }
    .header.bg-headbar-mobile{
        background-color: rgba(0,0,0,0.7);
    }
    .header.header-bg-white{
        background-color: rgba(255,255,255,0.7); !important;
    }
    .container{width: 94%;}
    /* #scroll-down{display: none;} */
    h2.project{margin-top: 40px; margin-bottom: 15px; font-weight: normal;}
    h3.subheader{ line-height: 2.0em; margin: 0;}
    .section{padding: 45px 0;}
    .work-nav ul li{margin: 3px 0.75em;display: block;margin: auto 0;font-size: 18px;padding: 3px 0;}
    .work-nav ul li#all { width: 3em; margin: auto;}
    .work-nav ul li#category-4 { width: 9em; margin: auto;}
    .work-nav ul li#category-1 { width: 7em; margin: auto;}
    .work-nav ul li#category-2 { width: 5em; margin: auto;}
    .work-nav ul li#category-3 { width: 9em; margin: auto;}
    .page-header h2{line-height: 45px; font-weight: normal; font-size: 30px; padding-top: 71px;}
    .bottom-link:after{bottom: 70px;}
    .view-all-work.bottom-link:after{width: 80px;}
    .view-all-work.bottom-link:hover:after{width: 180px;}
    .video-mobile{margin-top: 73px;}
    .project-nav .container{ width: 86%;}
    /* .fullscreen-img{padding-bottom: 0;} */
    .home-name-title{font-size: 30px !important;}
    .aboutus-content{width: 100%; padding-top: 0;}
    .modal-dialog {
        width: 100%;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%) !important;
        margin: 0;
    }

    .column.alpha.border:after {
        clear: both;
        display: block;
        content: "";
    }
    .work-copy{width: 100%;}
    h2.project{font-size: 30px;}
    .project-nav-next {
        float:right;
        cursor:pointer;
        position: absolute;
        bottom: 14em;
        right: 17px;
    }
    .contact-header.contact-bottom{margin-top: 20px !important;}
    h2.about-header{font-size: 30px; font-weight: normal;}
    .aboutus-section{padding-bottom: 59px !important; padding-top: 0 !important;}
    .column p{padding-bottom: 0; margin: 0;}

    .aboutus-content h2{
        text-align: left;
    }
    .border:before{
        padding: 0 50px;
    }

    .grid-copy p{
        margin-bottom: 0 !important;
    }
}

@media only screen and (max-width: 480px) {
    /* Mobile */
    h1 {
        font-size:40px;
    }
    .hero-text {
        padding-top:7vh;
        margin:0;
        float:none;
        width:100%;
    }
    .category {
        top:30%;
        font-size:16px;
    }
    .title {
        top:42%;
        font-size:30px;
    }
    .footer-logo {
        float:left;
        margin-bottom:3px;
        margin-left:8vw;
    }
    .copyright {
        position:relative;
        float:left;
        width:100%;
        left:0;
        margin-left:0;
        margin-bottom: 10px;
    }
    .copyright p {
        font-size:14px;
        text-align: center;
    }
    .footer-social-icons {
        width:100%;
        float:left;
        margin-left:0;
        margin-right:0;
        margin-top: 2vh;
        text-align: center;
    }
    .insta-mobile {
        display:block;
    }
    .insta-tablet, .insta-desktop {
        display:none!important;
    }
    h2.name {
        margin-top:20px;
    }
    .column {
        width:100%;
        position:relative;
        float:none;
        height:auto;
        margin-right:0;
        margin-left:0;
    }
    .column-2 {
        width:100%;
        position:relative;
        float:none;
        height:auto;
        margin-right:0;
        margin-left:0;
    }
    .column-2.alpha { padding-bottom: 20px;}
    footer {
        /* padding-top: 0; */
        padding-bottom:50px;
        height:75px;
    }
    .cover-logo{
        width: 180px;
        height: 180px;
    }
}

@media only screen and (min-width: 481px) and (max-width: 768px) {
    /* Intermediate */
    .hero-text {
        padding-top:31vh;
        margin:0;
        float:none;
        width:100%;
    }
    h1 {font-size:40px;}
    .grid-hero:before, .grid-item:before {
        top:68%;
    }
    .category {
        top:30%;
        font-size:12px;
    }
    .title {
        top:44%;
        font-size:45px;
    }
    .insta-mobile {
        display:block;
    }
    .insta-tablet, .insta-desktop {
        display:none!important;
    }
    .column {
        width:100%;
    }
    .column:first-child {
        margin-right: 0;
    }
    .column:last-child {
        margin-left: 0;
    }
    footer {
        padding-bottom:50px;
        height:75px;
    }
}

@media only screen and (min-width: 769px) and (max-width: 1139px) {
    /* Small */
     h1 {
        font-size:45px;
    }
    .insta-tablet {
        display:block;
    }
    .insta-mobile, .insta-desktop {
        display:none!important;
    }
    .title {
        font-size:45px;
    }
    
}

@media only screen and (min-width: 1140px) {
    /* Desktop */
    .insta-desktop {
        display:block;
    }
    .insta-mobile, .insta-tablet {
        display:none!important;
    }
    
}

/* Column Reset */
@media only screen and (min-width: 670px) and (max-width:1000px) {
    .column {
        width:40%;
        float:left!important;
        margin-left:0!important;
        margin-right:5%!important;
    }
}

/* Scroll Lock */
.lock {
    overflow-y:hidden;
}

/* Helper classes */
@media only screen and (min-width: 769px) {
    .desktop-hidden {
        display:none;
    }
}

@media only screen and (max-width: 768px) {
    .mobile-hidden {
        display:none;
    }
}