/* Mobile Landscape */

/******************GLOBAL****************************/

@media (orientation: landscape) {

:root {
  --p-font-size: 3.2vh;
  --p-line-height: 5vh; 
  --hone-font-size:6.3vh;
  --htwo-font-size:4.3vh;
  --htwo-line-height:5.3vh;
  --nav-font-size:4.2vh;
  --nav-header-font-size:4.6vh;
  --home-deliver: 70%;
}
      
    header a, header .break {
        font-size: 4.2vh;
    }
    
    article, section, footer {
        width:90%;
        padding: 1% 5%;
    }
    
    p, ul, li, ol, address, a[href^=tel] {
        font-size: var(--p-font-size);
        line-height: var(--p-line-height);
    }
    
    section.subpage-hero-subsection {
        flex-wrap: wrap;
        max-height: max-content;
    }
    
    .seventy-percent-width, .thirty-percent-width, .fifty-percent-width {
        flex-basis: 100% !important;
    }
    
    .thirty-percent-width h3 {
        text-align: center;
        padding:5% 0;
        font-size: x-large;
    }
    
    div.subsection-title h1 {
        font-size: var(--hone-font-size);
        line-height: 8.5vh;
    }
    
    div.subsection-subtext h2 {
        font-size: 6.3vh;
        line-height: 7.5vh;
        font-weight: bolder;
    }
    
    section.quote div h1 {
        line-height: 7vh;
        font-size: 4.5vh;
    }
    
    section.subpage-mid-hero div h3 {
        font-size: 3.7vh;
    }
      
    section.subpage-body div.subsection-subtext h1, section.subpage-body div.subsection-subtext p, section.subpage-body div.subsection-subtext ul {
        padding: 0 10% 0 0;
    }
    
    section.subpage-body div.subsection-subtext h1 {
        font-size: x-large;
    }
    
    img.subsection-image {
        min-height: 50%;
        max-height: 100%;
        height: auto;
        width: 90%;
    }
    
    section.site-cta a:link, div.row-break a.cta:link, section.site-cta a:visited, div.row-break a.cta:visited {
        font-size: 3.5vh;
        padding: 2.3% 7%;
    }
    
    section.home-deliver div {
        width: 80%;
        height: 50%;
        padding: 2% 10%;
    }
    
    section.home-projects {
        width:90%;
        padding: 1% 5%;
    }
    
    section.subpage-project-profile div p, section.subpage-project-profile div ol, section.subpage-project-profile div ul, section.subpage-project-profile div span {
        width:100%;
    }
    
    section.subpage-project-profile div ol, section.subpage-project-profile div ul {
        width: 100%;
        padding: 0;
        margin: 0;
    }
    
    ul.project-profile-list-items li b {
        font-size: 4.3vh;
    }
    
    ul.project-profile-list-items li {
        min-width: 49%;
        font-size: 5vh;
        line-height: 7vh;
    }
    
    img.project-profile-logo {
        right:5%;
    }
    
    ul.giving-back-list-items {
        width:100% !important;
    }
    
    ul.project-profile-list-items, ul.giving-back-list-items {
        display: flex;
        flex-wrap: wrap;
    }
    
   ul.giving-back-list-items li {
        flex-basis: 44%;
        margin: 5% 6% 0 0;
    }
    
    ul.giving-back-list-items li img.attachment-post-thumbnail {
        height: auto;
    }
    
    ul.giving-back-list-items h4 {
        font-size: var(--htwo-font-size);
    }
    
    ul.giving-back-list-items p {
        font-size:var(--p-font-size);
        line-height:var(--p-line-height);
    }
    
    ul.giving-back-list-items .post-link {
        font-size: 3.5vh !important;
        padding: 1vh 5vh;
        margin: 7%;
    }
    
    section.subpage-mid-hero.tech-ecosystem, section.subpage-mid-hero.industries, section-subpage {
        height: auto;
    }
    
     h2, section.subpage-mid-hero.tech-ecosystem div h1, section.subpage-mid-hero.industries div h1 {
        font-size: x-large;
        line-height: inherit;
    }
    
    section.subpage-mid-hero.tech-ecosystem div span, section.subpage-mid-hero.industries div span {
        width:62%;
        font-size: var(--p-font-size);
    }
    
    section.subpage-mid-hero.tech-ecosystem ul li, section.subpage-mid-hero.industries ul li {
        background-size: 120% !important;
        background-position: center center !important;
    }
    
    ul.our-work-filter, ul.insights-filter {
        display: none;
    }
    
    section.subpage-our-work div.project-background-frame {
        max-width: 27%;
        flex: 1 0 27%;
        max-height: 240px;
        margin: 2%;
    }
    
    div.two, div.three {
    height:35%;
    }
    
    section.subpage-our-work div.project-background-frame h3, section.subpage-our-work div.project-background-frame span {
        font-size: 3.3vh;
        line-height: 4.5vh;
    }
    
    article.news-items, article.insights-items {
        flex: 1 0 45%;
        max-width: 45%;
    }
    
    article.news-items img, article.insights-items img {
        height: auto;
        min-height: auto;
    }
    
    article.insights-items span a {
        font-size:2.8vh;
    }
    
    article.insights-items h4, article.news-items h4, article.news-items:nth-of-type(1) h4, article.news-items:nth-of-type(2) h4 {
        font-size: 4vh;
        line-height: 5vh;
    }
    
    article.news-items p, article.insights-items p, article.news-items:nth-of-type(1) p, article.news-items:nth-of-type(2) p {
        font-size: 3.9vh;
        line-height: 5.9vh;
    }
    
    section.home-end-to-end a, article.news-items a, article.insights-items a, article.event-items a {
        font-size: 3.5vh !important;
    }
    
    section.subpage-insights-single-post {
        flex-direction: column-reverse;
        height: -webkit-fit-content;
    }
    
    .seventy-percent-width p, .seventy-percent-width ul, .seventy-percent-width span, .seventy-percent-width h2, div.subsection-subtext h2 {
        width:100%;
    }
    
    .seventy-percent-width div.subsection-subtext h2 {
        margin: 2% 0 2% 0;
    }
    
    ul.insights-podcast-list-items, ul.insights-article-list-items {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        width:100%;
    }
    
    ul.insights-article-list-items li.author_name {
        font-size: 5vh;
    }
    
    ul.insights-article-list-items li.author_description {
        font-size: 4vh;
        line-height: 6vh;
        padding: 0 0 5% 0;
    }
    
    ul.insights-podcast-list-items li.podcast_length, ul.insights-article-list-items li.article_length {
        font-size: 3vh;
        padding: 2% 0;
        width: 100%;
    }
    
/*ENDS GLOBAL PORTRAIT STYLE*/    
/******************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/  /*BEGINS DEVICE SPECIFIC PORTRAIT STYLE*/  
@media only screen 
  and (max-device-width: 992px) 
  and (orientation: landscape) {
    /*Create Horizontal Menu*/
    div.menu {
        font-size: 16vw;
        width: 10vw;
        height: 13vh;
    }
    
    div.menu span {
        line-height: 3vh;
    }
    
    aside {
        width:90%;
        right:-100%;
        background-size: 20%;
        height: 100%;
        padding:1% 5% !important;
        overflow-y: hidden;
    }
      
    @keyframes open_nav {
      from {right:-100%;}
      to {right:0%;}
    }

    @-webkit-keyframes open_nav {
      from {right:-100%;}
      to {right:0%;}
    }

    @-moz-keyframes open_nav {
      from {right:-100%;}
      to {right:0%;}
    }
      
    
    @keyframes close_nav {
      from {right:0%; }
      to {right:-100%; }
    }

    @-webkit-keyframes close_nav {
      from {right:0%; }
      to {right:-100%; }
    }

    @-moz-keyframes close_nav {
      from {right:0%; }
      to {right:-100%; }
    }
    
    nav {
        display: flex;
        flex-direction: row;
        align-items: center;
    }
    
    nav dl {
        min-width: 30%;
        align-self: flex-end;
        justify-content: center;
        flex: 1;
        height: 70%;
    }
    
    nav dt {
        font-size: var(--nav-header-font-size);;
    }
    
      nav dd {
        font-size: var(--nav-font-size);
    }
      
}
    
/* ----------- iPhone 5 ----------- */
@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 568px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) {    
}
    
/* ----------- iPhone 6 ----------- */
@media only screen 
  and (min-device-width: 375px) 
  and (max-device-width: 667px) 
  and (-webkit-min-device-pixel-ratio: 2)
  and (orientation: landscape) { 
}

/* ----------- iPhone 6+ ----------- */
@media only screen 
  and (min-device-width: 414px) 
  and (max-device-width: 736px) 
  and (-webkit-min-device-pixel-ratio: 3)
  and (orientation: landscape) { 
}
    
/* ----------- iPhone X ----------- */
@media only screen 
and (min-device-width : 375px) 
and (max-device-width : 812px) 
and (-webkit-device-pixel-ratio : 3)
and (orientation : landscape) { 
}
    
/* ----------- iPad  ----------- */   
@media only screen 
  and (min-device-width: 768px) 
  and (max-device-width: 1024px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 3) {
    section.subpage-our-work div.project-background-frame {
        flex: 1 0 30%;
        max-width: 30%;
      }
      
    section.subpage-hero {
          height: 66%;
      }
}
    
/* ----------- iPad Pro ----------- */   
@media only screen 
  and (min-width: 1366px) 
  and (max-width: 1366px) 
  and (orientation: landscape) 
  and (-webkit-min-device-pixel-ratio: 2) {
    section.subpage-our-work div.project-background-frame {
        flex: 1 0 30%;
        max-width: 30%;
      }
      
      body {
          display: none;
      }
      
      section.subpage-hero {
          height: 66% !important;
      }
}
    
/****************************END ALL STYLES************************************/
}