@media only screen and (max-width: 1200px) {
  header nav ul {
    padding: 15px 10px 40px 0; }
    header nav ul a, header nav ul span.menu-link {
      font-size: 0.8em; }
  header p.sub-title {
    font-size: 1.2em; }
  header h1.page-title {
    font-size: 5em; }
    header h1.page-title.long-title {
      font-size: 3.5em;
      padding-top: 20px; }
  header h1.news-story-title {
    font-size: 3.33em; }
  header div.cover-image-small {
    height: calc(8em + 120px); }
    header div.cover-image-small h1.page-title {
      font-size: 4em; }
      header div.cover-image-small h1.page-title.long-title {
        font-size: 2.8em;
        padding-top: 20px; }
    header div.cover-image-small h1.news-story-title {
      font-size: 2.33em; }
  div.product-tile-container div.product-tile div.product-background .slider {
    top: 60%; }
    div.product-tile-container div.product-tile div.product-background .slider p {
      margin-top: 12%; }
  #squares-container .square h4 {
    font-size: 1.2em; }
  #squares-container .square p {
    font-size: 1.1em;
    line-height: 1.3; } }

@media only screen and (max-width: 1000px) {
  #squares-container .square {
    width: 50%;
    height: calc(50vw - 40px); }
    #squares-container .square .slider {
      top: 0;
      background-color: rgba(0, 0, 0, 0.5); }
    #squares-container .square h4 {
      font-size: 1.3em; }
    #squares-container .square p {
      font-size: 1.2em;
      line-height: 1.5; } }

@media only screen and (max-width: 850px) {
  h2, h3 {
    margin: 1em 0 0.7em 0; }
  h2 {
    font-size: 1.8em; }
  h3 {
    font-size: 1.5em; }
  main p, main li, main a, main label, main input, main textarea, main select {
    font-size: 1em; }
  .wrap-wide {
    padding: 0 20px; }
  a.contact-us-link {
    padding: 0; }
  header nav div.mobile-menu-button {
    display: block;
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 100; }
    header nav div.mobile-menu-button:hover {
      cursor: pointer; }
  header nav div.menu-container {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    width: 100%;
    overflow-x: hidden;
    pointer-events: none; }
    header nav div.menu-container * {
      pointer-events: all; }
  header nav ul {
    position: absolute;
    right: -70%;
    background-color: rgba(0, 0, 0, 0.9);
    float: none;
    transition: 0.4s;
    z-index: 10;
    display: block;
    padding: 60px 0 0 0;
    height: 100vh; }
    header nav ul.show {
      left: auto;
      right: 0;
      transition: 0.4s; }
    header nav ul li {
      display: block;
      padding: 0 10px 0 40px;
      margin: 0;
      float: none;
      transform: none;
      top: unset; }
      header nav ul li a, header nav ul li span.menu-link {
        font-size: 1em; }
      header nav ul li ul.sub-menu {
        display: block;
        width: auto;
        height: auto;
        background: none;
        padding: 0;
        margin: 10px 15px 10px 0;
        position: relative;
        border-right: solid 1px #fff;
        text-align: right; }
        header nav ul li ul.sub-menu li {
          width: auto;
          margin: 0; }
          header nav ul li ul.sub-menu li a {
            text-align: right;
            width: auto; }
          header nav ul li ul.sub-menu li ul.sub-menu-2 {
            display: block;
            width: auto;
            height: auto;
            background: none;
            padding: 0;
            margin: 10px 15px 10px 0;
            position: relative;
            border-right: solid 1px #fff;
            text-align: right; }
            header nav ul li ul.sub-menu li ul.sub-menu-2 li {
              width: auto;
              margin: 0; }
              header nav ul li ul.sub-menu li ul.sub-menu-2 li a {
                text-align: right;
                width: auto; }
  header h1.page-title {
    font-size: 4em;
    margin-top: 50px; }
    header h1.page-title.long-title {
      font-size: 2.8em;
      padding-top: 20px; }
  header h1.news-story-title {
    font-size: 2.66em; }
  header p.sub-title {
    padding-right: 20px; }
  header div.cover-image-small {
    height: calc(4em + 100px); }
    header div.cover-image-small h1.page-title {
      font-size: 3em; }
      header div.cover-image-small h1.page-title.long-title {
        font-size: 2em;
        padding-top: 0; }
    header div.cover-image-small h1.news-story-title {
      font-size: 2em; }
  div.product-tile-container div.product-tile {
    width: 50%;
    height: calc(50vw - 40px);
    max-height: none; }
    div.product-tile-container div.product-tile div.product-background.planit .slider, div.product-tile-container div.product-tile div.product-background.engage .slider {
      background-color: rgba(150, 40, 51, 0.7); }
      div.product-tile-container div.product-tile div.product-background.planit .slider:hover, div.product-tile-container div.product-tile div.product-background.engage .slider:hover {
        background-color: rgba(150, 40, 51, 0.7); }
      div.product-tile-container div.product-tile div.product-background.planit .slider .link-slider a, div.product-tile-container div.product-tile div.product-background.engage .slider .link-slider a {
        color: #962833; }
    div.product-tile-container div.product-tile div.product-background.work-placements .slider, div.product-tile-container div.product-tile div.product-background.publications .slider {
      background-color: rgba(0, 101, 134, 0.7); }
      div.product-tile-container div.product-tile div.product-background.work-placements .slider:hover, div.product-tile-container div.product-tile div.product-background.publications .slider:hover {
        background-color: rgba(0, 101, 134, 0.7); }
    div.product-tile-container div.product-tile div.product-background.work-placements .link-slider a, div.product-tile-container div.product-tile div.product-background.publications .link-slider a {
      color: #006586; }
    div.product-tile-container div.product-tile div.product-background.cpd .slider, div.product-tile-container div.product-tile div.product-background.devs .slider {
      background-color: rgba(2, 139, 97, 0.7); }
      div.product-tile-container div.product-tile div.product-background.cpd .slider:hover, div.product-tile-container div.product-tile div.product-background.devs .slider:hover {
        background-color: rgba(2, 139, 97, 0.7); }
    div.product-tile-container div.product-tile div.product-background.cpd .link-slider a, div.product-tile-container div.product-tile div.product-background.devs .link-slider a {
      color: #028b61; }
    div.product-tile-container div.product-tile div.product-background .slider {
      top: 0; }
      div.product-tile-container div.product-tile div.product-background .slider p {
        margin-top: 17%; }
      div.product-tile-container div.product-tile div.product-background .slider h4 {
        font-size: 1.2em;
        box-shadow: none;
        background: none; }
    div.product-tile-container div.product-tile div.product-background .link-slider {
      top: 80%; }
      div.product-tile-container div.product-tile div.product-background .link-slider a {
        text-decoration: none;
        background-color: rgba(255, 255, 255, 0.9);
        padding: 8px 12px;
        border-radius: 8px;
        font-weight: 900; }
  div.portfolio-header {
    margin-top: 3em; }
    div.portfolio-header h3 {
      font-size: 2em; }
  div.testimonial-box {
    margin-top: 50px;
    padding: 3em 2em 2em 5.2em; }
    div.testimonial-box .text {
      font-size: 1.3em;
      padding-right: 2.2em; }
    div.testimonial-box .open-quote {
      font-size: 6em; }
    div.testimonial-box .close-quote {
      font-size: 6em; }
    div.testimonial-box .vcard {
      font-size: 1.2em; }
  div.info-block {
    font-size: 0.8em; }
    div.info-block div.text {
      padding: 15px;
      font-size: 1em;
      line-height: 1.25; }
    div.info-block.small div.image {
      width: 25%; }
    div.info-block.small div.text {
      width: 75%;
      padding-left: 5px;
      padding-right: 0; }
  footer div.logos .logo {
    padding: 10px; }
  #squares-container .square h4 {
    font-size: 1.2em; }
  #squares-container .square p {
    font-size: 1em;
    line-height: 1.3; } }

@media only screen and (max-width: 650px) {
  header nav ul {
    right: -100%;
    width: 100%; }
  header div.cover-image-large {
    height: 60vw;
    min-height: 350px; }
  header h1.page-title {
    font-size: 3em; }
    header h1.page-title.long-title {
      font-size: 2em;
      padding-top: 0; }
    header h1.page-title img {
      max-width: 40%; }
  header h1.news-story-title {
    font-size: 2em; }
  header p.sub-title {
    font-size: 1em;
    line-height: 1.2; }
  header div.cover-image-small {
    height: calc(2.5em + 100px); }
    header div.cover-image-small h1.page-title {
      font-size: 2.5em;
      margin-top: 45px; }
      header div.cover-image-small h1.page-title.long-title {
        font-size: 1.8em;
        margin-top: 50px; }
    header div.cover-image-small h1.news-story-title {
      font-size: 1.66em; }
  main header.vcard {
    font-size: 1.1em; }
  img.book-cover {
    max-width: 25%; }
  div.product-tile-container div.product-tile {
    width: 100%;
    height: 60vw;
    min-height: 250px;
    max-height: none; }
    div.product-tile-container div.product-tile div.product-background .slider {
      padding-top: 20px; }
      div.product-tile-container div.product-tile div.product-background .slider p {
        margin-top: 10%; }
      div.product-tile-container div.product-tile div.product-background .slider .text-saver {
        padding-top: 20px; }
  footer div.logos br {
    display: none; }
  footer div.logos .logo {
    max-width: 30%;
    padding: 20px; }
    footer div.logos .logo.wide {
      max-width: 40%; }
  footer div.copyright {
    float: none;
    padding-top: 60px;
    padding-bottom: 0; }
  footer div.footer-menu ul {
    float: none; }
  div.testimonial-box {
    padding: 3em 1em 1em 3.2em; }
    div.testimonial-box .text {
      font-size: 1.1em;
      padding-right: 1.2em; }
    div.testimonial-box .open-quote {
      font-size: 4em; }
    div.testimonial-box .close-quote {
      font-size: 4em; }
    div.testimonial-box .vcard {
      font-size: 1.1em; }
  a.news-container {
    padding: 15px;
    padding-left: calc(20% + 15px); }
    a.news-container div.featured-image {
      right: 80%; }
      a.news-container div.featured-image .glyphicons {
        font-size: 2em; }
  .no-header {
    padding-top: 0; }
  .hide-on-mobile {
    display: none; }
  #squares-container .square {
    width: 100%;
    height: calc(100vw - 40px);
    max-height: 300px; }
    #squares-container .square h4 {
      font-size: 1.1em; }
    #squares-container .square p {
      font-size: 1em;
      line-height: 1.5; }
  #next-options-container .next-option {
    float: none;
    width: 100%;
    padding: 0;
    margin: 20px 0; }
    #next-options-container .next-option .next-option-content p a {
      font-size: 1.2em;
      line-height: 40px; }
      #next-options-container .next-option .next-option-content p a span.glyphicons {
        line-height: 45px; } }

@media only screen and (max-width: 450px) {
  h2 {
    font-size: 1.4em; }
  h3 {
    font-size: 1.2em; }
  header h1.page-title {
    font-size: 2.5em; }
    header h1.page-title.long-title {
      font-size: 1.8em;
      padding-top: 0; }
  header h1.news-story-title {
    font-size: 1.66em; }
  header p.sub-title {
    font-size: 1.1em; }
  header nav ul li {
    padding-left: 0; }
  div.product-tile-container div.product-tile div.product-background .slider h4 {
    padding: 10px 15px; }
  .no-mobile-padding {
    padding-left: 0;
    padding-right: 0; }
  footer div.logos br {
    display: none; }
  footer div.logos .logo {
    max-width: 40%;
    padding: 20px; }
    footer div.logos .logo.wide {
      max-width: 55%; }
  a.news-container {
    padding-left: 15px; }
    a.news-container div.featured-image {
      display: none; }
      a.news-container div.featured-image img {
        display: none; }
    a.news-container h3 {
      font-size: 1.5em; }
  #squares-container .square p {
    font-size: 1em;
    line-height: 1.2; }
  #next-options-container .next-option .next-option-content p a {
    font-size: 1em; } }

@media only screen and (max-width: 300px) {
  header nav ul {
    right: -100%; } }