/* Defaults */

html {
    -webkit-text-size-adjust: none; /* Prevent font scaling in landscape */
}

#navigation,
.mobile,
.mobile-bio,
#logo-mobile img {
    display:none;
}


@media (max-width: 1550px) {
    .container {
        width:100%;
        padding-left:40px;
        padding-right:40px;
    }

    #intro .container {
        padding-left:40px;
        padding-right:40px;
    }

    #logo {
        background:url("../images/logo-background.svg") no-repeat 0 0;
    }

    #logo img {
        left:40px;
    }

    nav .container {
        width:100%;
        padding:0;
    }

    nav .button {
        right:40px;
    }

    header .container,
    .home header .container {
        width:100%;
    }

    header p {
        margin:0 0 20px 0;
    }

    header .two-columns-photo-left .col:nth-child(2) .content {
        width:100%;
        padding:100px 40px 100px 60px;
    }

    .scroll-arrow {
        left:40px;
    }

    #steps .col {
        padding:0 20px;
    }

    #steps .col .step {
        width:100%;
    }

    #why-choose .container {
        padding-top:70px;
        padding-bottom:80px;
    }

    #why-choose img {
        width:auto;
        height:600px;
        position:absolute;
        top:50%;
        left:0;
        margin-top:-300px;
    }

    #why-choose h3 br {
        display:none;
    }

    #your-future .two-columns-photo-right .col:nth-child(1) .content,
    #your-future .two-columns-photo-right .col:nth-child(2) .content,
    .two-columns-photo-right .col:nth-child(1) .content,
    .two-columns-photo-right .col:nth-child(2) .content {
        width:100%;
        padding:70px 40px;
    }

    #blog-list .widget {
        padding:25px 0 25px 35px;
    }

    .wp-block-search__input {
        min-width:250px;
    }

    .four-columns {
        grid-template-columns:22% 22% 22% 22%;
        justify-content:space-between;
        column-gap:0;
    }

    #latest-projects .three-columns {
        grid-template-columns:31% 31% 31%;
        justify-content:space-between;
        column-gap:0;
        row-gap:50px;
    }

    .three-columns {
        grid-template-columns:31% 31% 31%;
        justify-content:space-between;
        column-gap:0;
        row-gap:50px;
    }

    #contact-info .three-columns .col {
        padding:0;
    }

    #why-dynamic {
        padding-left:40px;
        padding-right:40px;
    }

    #why-dynamic .container {
        padding-left:40px;
        padding-right:40px;
    }

    footer .container {
        width:100%;
        padding:70px 40px;
    }

    footer .grid {
        grid-template-columns:25% 25% 50%;
    }


}

@media (max-width: 1350px) {
    h1 {
        font-size:65px;
        line-height:70px;
    }

    #mission-values-vision .container {
      width:100%;
      position:relative;
      left:0;
    }

    .two-columns-photo-left .col .content {
        width:100%;
        padding:100px 40px 100px 60px;
    }
}

@media (max-width: 1250px) {
    .two-columns .col .content {
        padding:0 40px 60px 40px;
    }

    .four-columns {
        grid-template-columns:31% 31% 31%;
        justify-content:space-between;
        column-gap:0;
    }

    .home header h1 br, header h1 br {
        display:none;
    }

    .home header .two-columns {
        padding:80px 0 100px 0;
    }

    header .two-columns {
        flex-wrap:wrap;
    }

    header .two-columns .col:nth-child(1),
    header .two-columns .col:nth-child(2) {
        width:100%;
    }

    #home-video {
        margin-top:-40px;
    }

    #home-video .container {
        height:500px;
    }


    #why-choose .col:nth-child(1) {
        width:40%;
    }

    #why-choose .col:nth-child(2) {
        width:60%;
    }

    #why-choose img {
       left:-50px;
    }

    .wp-block-search__input {
        min-width:200px;
    }

    #home-accordion ul li {
        padding:30px 40px;
    }

    #home-accordion ul li p {
        line-height:24px;
        margin:0 0 20px 0;
    }

    #home-accordion .two-columns .col:nth-child(1) {
        width:-webkit-calc(100% - 350px);
        width:-moz-calc(100% - 350px);
        width:calc(100% - 350px);
    }

    #home-accordion .two-columns .col:nth-child(2) {
        width:350px;
    }

    #home-accordion .two-columns .col:nth-child(1) .link {
        position:relative;
        top:auto;
        right:auto;
    }

    .home .swiper .description {
        height:auto;
        display:block;
    }

    .home .swiper .description p {
        position:relative;
        height:100%;
        display:block;
        padding:15px 15px;
        margin:0;
    }

    .home .swiper .description .link {
        height:auto;
        border-left:0;
        display:block;
        position:relative;
        top:auto;
        right:auto;
        padding:0 15px 15px 15px;
    }

    #why-choose-dynamic .two-columns {
        display:block;
    }

    #why-choose-dynamic .two-columns .col {
        width:100%;
        margin:0 0 50px 0;
    }

    #why-choose-dynamic .two-columns .col .content {
        padding:0;
    }

    #why-choose-dynamic .two-columns .col img {
        width:800px;
        display:block;
        margin:0 auto;
    }
}

@media (max-width: 1200px) {
    .page-template-projects #blog-list .photo {
        width:400px;
    }

    .page-template-projects #blog-list .content {
        width:-webkit-calc(100% - 400px);
        width:-moz-calc(100% - 400px);
        width:calc(100% - 400px);
        padding-left:40px;
    }

    .wp-block-search__input {
        width:170px;
    }
}

@media (max-width: 1150px) {
    h2 {
        font-size:45px;
        line-height:50px;
    }

    h4 {
        font-size:30px;
        line-height:35px;
    }

    #mission-values-vision h4 {
        font-size:35px;
    }

    nav ul,
    nav .button {
        display:none;
    }

    /* Mobile Nav */

    #logo-mobile img {
        display:block;
    }

    #navigation .main-nav {
        display:block;
    }

    nav .button {
        display:none;
    }

    .menu-wrapper {
        display:block;
    }

    .menu-wrapper {
        background:url("../images/mobile-nav-background.svg") no-repeat 0 0;
        position:fixed;
        top:20px;
        right:40px;
        width:50px;
        height:58px;
        display:flex;
        align-items:center;
        justify-content:center;
        cursor: pointer;
        z-index:999;
    }

    #nav-button {
        position:relative;
        transform:translateY(0);
        transition:all 0ms 200ms;
    }

    #nav-button span {
        width:26px;
        height:3px;
        display:block;
        background:rgba(255, 255, 255, 1);
    }

    #nav-button.active .line2 {
        background: rgba(255, 255, 255, 0); 
    }

    #nav-button .line1 {
        position:absolute;
        left:0;
        bottom:8px;
        transition:bottom 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
    }

    #nav-button .line3 {
        position:absolute;
        left:0;
        top:8px;
        transition:top 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
    }

    #nav-button.active .line3 {
        top:0;
        transform:rotate(45deg);
        transition:top 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
    }

    #nav-button.active .line1 {
        bottom:0;
        transform:rotate(-45deg);
        transition:bottom 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
    }

    #navigation {
        width:100%;
        text-align:center;
        position:fixed;
        top:0;
        left:0;
        z-index:4;
        padding:140px 20px 0 20px;
        display:none;
        opacity:0;
    }

    #navigation-overlay {
        width:100%;
        height:100%;
        background:rgb(47,48,49);
        background:linear-gradient(0deg, rgba(47,48,49,1) 0%, rgba(73,74,76,1) 100%);
        position:fixed;
        top:0;
        left:0;
        z-index:3;
        display:none;
        opacity:0;
    }

    #navigation ul {
        list-style:none;
    }

    #navigation ul.sub-menu {
        display:none;
    }

    #navigation li {
        margin:0;
    }

    #navigation li a {
        font:500 30px/30px "PP Neue Montreal", arial, sans-serif;
        letter-spacing:0.03em;
        color:#fff;
        text-decoration:none;
        display:block;
        padding:10px 0;
    }

    #navigation .button {
        background:#f17130;
        font:600 30px/30px "rift", arial, sans-serif;
        letter-spacing:0.02em;
        text-transform:uppercase;
        text-decoration:none;
        color:#fff;
        display:inline-block;
        padding:15px 25px 15px 30px;
        margin-top:30px;
    }

    #navigation .button:after {
        display:none;
    }

    header {
        height:auto;
        min-height:auto;
    }

    header .two-columns-photo-left .col:nth-child(1) {
        display:none;
    }

    header .two-columns-photo-left .col:nth-child(2) {
        width:100%;
    }

    header .two-columns-photo-left .col:nth-child(2) .content {
        padding:80px 40px 80px 40px;
    }

    .home #intro .container {
        width:100%;
    }

    #why-choose .col:nth-child(1) {
        width:30%;
    }

    #why-choose .col:nth-child(2) {
        width:70%;
    }

    #why-choose img {
       left:-100px;
    }

    #intro .container {
        width:100%;
        padding-left:20px;
        padding-right:20px;
    }

    #steps-two-columns .col:nth-child(odd) .step {
        padding-right:30px;
    }

    #steps-two-columns .col:nth-child(even) .step {
        padding-left:30px;
    }

    .heading {
        display:block;
    }

    .heading h4 {
        line-height:43px;
        margin:0 0 20px 0;
    }

    #latest-projects .three-columns {
        grid-template-columns:48% 48%;
        justify-content:space-between;
        column-gap:0;
        row-gap:50px;
    }
}


@media (max-width: 1100px) {
    #categories .container {
        padding-top:20px;
        padding-bottom:10px;
    }

    #categories p {
        width:100px;
        padding-top:10px;
    }

    #category-nav {
        flex-wrap:wrap;
        padding:0;
    }

    #categories .container {
        align-items:start;
    }

    #category-nav li {
        margin-bottom:10px;
    }

    #category-nav li a {
        padding:10px 20px;
    }

}

@media (max-width: 1050px) {

    .home .swiper-button-next {
        margin-right:-30px;
    }

    .home .swiper-button-prev {
        margin-left:-44px;
    }

    .home .swiper-button-next, .home .swiper-button-prev {
        width:25px;
        height:40px;
    }

    #home-accordion .two-columns .col:nth-child(1) {
        width:100%;
    }

    #home-accordion .two-columns .col:nth-child(2) {
        display:none;
    }

    #dynamic-difference .flex {
        display:block;
    }

    #dynamic-difference .two-columns-photo-left .col:nth-child(1) {
        width:100%;
        height:350px;
        background-position:top center;
    }

    #dynamic-difference .two-columns-photo-left .col:nth-child(2) {
        width:100%;
    }

    #dynamic-difference .two-columns-photo-left .col .content {
        padding:80px 40px 100px 40px;
    }

    .three-columns .col {
        flex:0 1 auto;
    }

    #steps .grid {
        display:flex;
        flex-wrap:wrap;
    }

    #steps .col {
        width:50%;
        padding:0 25px;
        margin:0 0 50px 0;
    }

    #steps .col:last-child {
        margin:0;
    }

    #why-choose .col:nth-child(1) {
        display:none;
    }

    #why-choose .col:nth-child(2) {
        width:100%;
        padding:0;
    }

    #why-choose:before {
        display:none;
    }

    #your-future .flex {
        display:block;
    }

    #your-future .col {
        width:100%;
    }

    .two-columns-photo-right.flex {
        display:block;
    }

    .two-columns-photo-right .col {
        width:100%;
        height:100%;
        flex:0 1 auto;
    }

    .two-columns.flex {
        display:block;
    }

    .two-columns-photo-right .col:nth-child(1) .content {
        float:none;
    }

    .two-columns .col .content {
        padding:0 30px;
    }

    .accordion-header h4 {
        font-size:35px;
        line-height:35px;
    }

    #blog-list ul li.flex {
        display:block;
    }

    .page-template-projects #blog-list .photo {
        width:400px;
        margin-bottom:20px;
    }

    .page-template-projects #blog-list .content {
        width:100%;
        padding-left:0;
    }

    #blog-list .two-columns.flex {
        display:flex;
    }

    #blog-list .col:nth-child(1) {
        width:68%;
    }

    #blog-list .col:nth-child(2) {
        width:32%;
    }

    #blog-list .two-columns .col:nth-child(odd) {
        border-bottom:0;
        margin-bottom:0;
    }

    #cta .two-columns-photo-left,
    #federal-government .two-columns-photo-left,
    #state-and-local-government .two-columns-photo-right,
    #education .two-columns-photo-left,
    #utility-sector .two-columns-photo-right {
        display:flex !important;
        flex-wrap:wrap;
    }

    #cta .two-columns-photo-left .col:nth-child(1),
    #federal-government .two-columns-photo-left .col:nth-child(1),
    #state-and-local-government .two-columns-photo-right .col:nth-child(2),
    #education .two-columns-photo-left .col:nth-child(1),
    #utility-sector .two-columns-photo-right .col:nth-child(2) {
        width: 100%;
        height: 350px;
        background-position: center center !important;
        flex:auto;
    }


    #cta .two-columns-photo-left .col:nth-child(2),
    #federal-government .two-columns-photo-left .col:nth-child(2),
    #state-and-local-government .two-columns-photo-right .col:nth-child(1),
    #education .two-columns-photo-left .col:nth-child(2),
    #utility-sector .two-columns-photo-right .col:nth-child(1) {
        width:100%;
    }

    #cta .two-columns-photo-left .col .content,
    #federal-government .two-columns-photo-left .col .content,
    #state-and-local-government .two-columns-photo-right .col .content,
    #education .two-columns-photo-left .col .content,
    #utility-sector .two-columns-photo-right .col .content {
        padding:80px 40px 100px 40px;
    }
}

@media (max-width: 950px) {

    .home header h1 {
        font-size:80px;
        line-height:80px;
    }

    .home header p br {
        display:none;
    }

    .intro {
        display:block;
    }

    .intro h3 {
        margin-bottom:15px;
    }

    #categories .container {
        display:block;
    }

    #categories p {
        margin-bottom:15px;
        padding-top:0;
    }

    footer .grid {
        display:flex;
        flex-wrap:wrap;
    }

    footer .grid .col:nth-child(1),
    footer .grid .col:nth-child(2) {
        width:50%;
        margin:0 0 40px 0;
    }

    footer .grid .col:nth-child(3) {
        text-align:center;
        width:100%;
    }
}

@media (max-width: 860px) {
    .flex-direction-nav {
        height:50px;
        margin-top:-25px;
    }
    
    .flex-prev {
        width:50px;
        height:50px;
        position:absolute;
        left:-25px !important;
    }
    
    .flex-next {
        width:50px;
        height:50px;
        position:absolute;
        right:-25px !important;
    }
}

@media (max-width: 850px) {



    .container,
    .container-centered {
        padding:80px 20px;
    }

    .menu-wrapper {
        right:20px;
    }

    .home header .container {
        height:550px;
        padding-left:20px;
        padding-right:20px;
    }

    header .container {
        height:450px;
        padding-left:20px;
        padding-right:20px;
    }

    header .two-columns-photo-left .col:nth-child(2) .content {
        padding:60px 20px;
    }

    header .overlay {
      background-image: linear-gradient(to left, rgba(43, 43, 43, 1), rgba(43, 43, 43, 0) 699px);
    }





    .four-columns {
        grid-template-columns:48% 48%;
    }

    .two-columns .col .content {
        padding:0;
    }

    .two-columns .col .photo {
        padding:0 0 50px 0;
    }

    .two-columns {
        flex-wrap:wrap;
    }

    .two-columns .col {
        width:100%;
    }

    .two-columns .col .content {
        margin-bottom:40px;
    }

    header h1,
    .home header h1 {
        font-size:60px;
        line-height:65px;
        padding:0;
    }

    .scroll-arrow {
        left:20px;
    }

    #logo img {
        left:20px;
    }

    #steps .col {
        width:100%;
    }

    #your-future .two-columns-photo-right .col:nth-child(1) .content,
    #your-future .two-columns-photo-right .col:nth-child(2) .content,
    .two-columns-photo-right .col:nth-child(1) .content,
    .two-columns-photo-right .col:nth-child(2) .content {
        padding:70px 20px;
    }

    #steps-two-columns .grid {
        width:100%;
        display:block;
    }

    #steps-two-columns .col:nth-child(odd) .step,
    #steps-two-columns .col:nth-child(even) .step {
        padding:0 0 0 25px;
    }

    #steps-two-columns .col .step {
        margin-bottom:60px;
    }

    .heading span {
        margin:0 0 0 0;
    }

    #dynamic-difference .two-columns-photo-left .col .content {
        padding:60px 20px 90px 20px;
    }

    #blog-list .two-columns.flex {
        display:block;
    }

    #blog-list .col:nth-child(1) {
        width:100%;
        border-right:0;
    }

    #blog-list .col:nth-child(2) {
        width:100%;
    }

    #blog-list ul li {
        padding-right:0;
    }

    #blog-content {
        padding-right:0;
    }

    .share {
        border:0;
        padding:0;
        margin-bottom:20px;
    }

    #blog-list .widget {
        padding-left:0;
    }

    #blog-list .widget:nth-child(1) {
        border:0;
        padding-bottom:15px;
    }

    #latest-projects .three-columns {
        grid-template-columns:100%;
        row-gap:70px;
    }

    .three-columns {
        grid-template-columns:48% 48%;
    }

    #contact-info .three-columns .col {
        border:0;
    }

    #cta .two-columns-photo-left .col .content,
    #federal-government .two-columns-photo-left .col .content,
    #state-and-local-government .two-columns-photo-right .col .content,
    #education .two-columns-photo-left .col .content,
    #utility-sector .two-columns-photo-right .col .content {
        padding:60px 20px 90px 20px;
    }

    #why-dynamic {
      padding-left:20px;
      padding-right:20px;
    }

    #why-dynamic .container {
        padding: 30px 20px;
    }

    .reverse {
        flex-direction:column-reverse;
    }

    hr.spacer.mobile {
        display:block;
    }

    footer .container {
        padding:50px 20px;
    }

    footer .col:nth-child(2),
    footer .col:nth-child(3),
    footer .col:nth-child(4) {
        width:50%;
    }
}

@media (max-width: 750px) {
    .accordion-header h4 {
        font-size:30px;
        line-height:30px;
    }

    .accordion-header {
        background:url(../images/accordion-background.svg) no-repeat -25px center / 130px 100px;
        padding-left:123px;
    }

    .accordion-header span {
        left:34px;
    }

    .accordion-content .content {
        padding-left:123px;
    }



    #project-gallery a {
        width:280px;
    }
}

@media (max-width: 650px) {
    h2 {
        font-size:45px;
        line-height:50px;
    }

    h3 {
    }

    h4 {
        font-size:30px;
        line-height:35px;
    }

    p {
    }

    .list li {
    }


     .four-columns {
        grid-template-columns:100%;
    }

    .home h1 {
        font-size:80px;
        line-height:80px;
    }

    #home-accordion ul li {
        padding:20px 20px;
    }

    .container,
    .container-centered {
        padding-top:70px;
        padding-bottom:70px;
    }

    #steps-two-columns .col:nth-child(odd) .step,
    #steps-two-columns .col:nth-child(even) .step {
        padding-left:15px;
    }

    #your-future .two-columns-photo-right .col:nth-child(1) .content, 
    #your-future .two-columns-photo-right .col:nth-child(2) .content, 
    .two-columns-photo-right .col:nth-child(1) .content, 
    .two-columns-photo-right .col:nth-child(2) .content {
        padding-top:60px;
        padding-bottom:80px;
    }

    #people .three-columns .col {
      width:350px;
    }

    #people .three-columns .portrait {
      height:400px;
    }

    .single header .container,
    .archive header .container,
    .search header .container {
        padding-top:60px;
        padding-bottom:50px;
    }

    #markets-header h3,
    .single header h1,
    .archive header h1,
    .search header h1 {
        font-size:45px;
        line-height:50px;
    }

    .single header h6,
    .archive header h6,
    .search header h6 {
        font-size:24px;
        line-height:26px;
    }

    .accordion-header {
        min-height:90px;
        height:auto;
        padding:10px 30px 10px 123px;
    }
}

@media (max-width: 550px) {

    header .video iframe,
    .home header .video iframe {
        min-width:117.77vh;
    }

    header h1,
    .home header h1,
    #subpage-header h1 {
        font-size: 50px;
        line-height: 50px;
    }

    header p {
      font-size:18px;
      line-height:26px;
    }

    .page-template-company-overview-form header {
        display:none;
    }

    .page-template-company-overview-form #intro .container {
        padding-top:120px;
    }

    #mission-values-vision .flex {
        display:block;
    }

    #mission-values-vision .icon {
        width:100%;
    }

    #mission-values-vision img {
        float:none;
    }

    #mission-values-vision .copy {
        width:100%;
        padding-top:0;
    }

    #contact-info .three-columns {
        display:block;
    }

    #contact-info .three-columns .col {
        width:100%;
    }

    #contact-info .three-columns .col:nth-child(1),
    #contact-info .three-columns .col:nth-child(2),
    #contact-info .three-columns .col:nth-child(3) {
        border:0;
        border-bottom:2px solid #f1f1f1;
        padding:0 0 20px 0;
        margin:0 0 20px 0;
    }

    #contact-info .three-columns .col:nth-child(3) {
        border-bottom:0;
        padding:0;
        margin:0;
    }

    #project-gallery a {
        width:100%;
        margin-right:0;
    }

    .accordion-header h4 {
        font-size:25px;
        line-height:25px;
    }

    .accordion-content .content {
        padding:20px 20px 30px 30px;
    }

    #intro #accordion.container {
        padding-left:20px;
        padding-right:20px;
    }
    
    .wpforms-container .wpforms-field .wpforms-field-row .wpforms-one-half {
        width:100% !important;
    }
    
    .wpforms-container .wpforms-field .wpforms-field-row .wpforms-field-row-block {
        padding:0 !important;
    }
    
    .wpforms-container .wpforms-field-sublabel {
        margin-bottom:15px !important;
    }

    .two-columns .col .photo-content {
        height:300px;
    }
    
    footer .grid .col:nth-child(1),
    footer .grid .col:nth-child(2) {
        width:100%;
        text-align:center;
        margin:0 0 20px 0;
    }
}

@media (max-width: 450px) {

    #home-video .container {
        height:400px;
    }

    
    .intro p {
        margin-bottom:15px;
    }

    .intro .button {
        position:relative;
        top:auto;
        right:auto;
    }

    .button {
        padding:10px 20px 10px 25px;
    }

    #home-case-studies .intro {
        padding-bottom:25px;
    }

    h2,
    .single h2 {
        font-size:35px;
        line-height:40px;
    }

    h3 {
        
    }

    .button-outlined {
        padding-left:15px;
        padding-right:15px;
    }

    nav {
        height:91px;
        background:#fff;
    }

    #logo {
        background:url("../images/logo-background.svg") no-repeat -70px -10px;
    }

    #logo img {
        width:160px;
    }

    header {
        margin-top:90px;
    }

    /*
    header .video iframe {
        width:100vw;
        height:100vw;
        min-height:130vw;
        min-width:130vw;
    }
    */

    .home h1 {
        font-size:60px;
        line-height:55px;
    }

    #steps .col {
        padding:0;
    }

    #steps .col .photo:before {
        left:0;
    }

    .page-template-projects #blog-list .photo,
    .page-template-projects #blog-list .photo img {
        width:100%;
    }


    #blog-list ul li h4 {
        font-size:25px;
        line-height:30px;
    }
    
    .flex-prev {
        width:40px;
        height:40px;
        left:-20px !important;
    }
    
    .flex-next {
        width:40px;
        height:40px;
        right:-20px !important;
    }
}


@media (max-width: 350px) {

    h3 {
        font-size:35px;
        line-height:40px;
    }

    h4 {
        font-size:25px;
        line-height:30px;
    }

    /*
    header .video iframe {
        width:100vw;
        height:100vw;
        min-height:150vw;
        min-width:150vw;
    }
    */

    header h1,
    .home header h1,
    #subpage-header h1 {
        font-size:45px;
        line-height:50px;
    }

    #dynamic-difference .two-columns-photo-left .col:nth-child(1) {
        height:300px;
    }
}