.w {
  width: 1220px;
  margin: 0 auto;
}
.ww {
  width: 1040px;
  margin: 0 auto;
}
.s {
  margin-top: 75px;
  margin-bottom: 75px;
}
#burger {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  z-index: 10;
  background: #fff;
  display: none;
}
#burger .inhead {
  padding: 0px 15px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: solid 1px rgba(0,0,0,0.05);
}
#burger .inhead h1 {
  margin-right: 40px;
}
#burger .inhead h1 a {
  display: block;
  font-size: 0;
  width: 56px;
  height: 19px;
  background: url("../img/logo-dark.svg");
  background-size: 56px;
}
#burger .inhead a#close-menu {
  display: block;
  font-size: 0;
  width: 18px;
  height: 18px;
  background: url("../img/icon-menu-close.svg");
  background-position: center center;
}
#burger .in {
  padding: 15px;
  overflow: auto;
  height: calc(100vh - 88px);
}
#burger .in h6 {
  margin: 30px 0 10px 0;
  font-size: 14px;
}
#burger .in h6:first-of-type {
  margin: 10px 0 10px 0;
}
#burger .in a {
  font-size: 21px;
  font-family: 'Px Grotesk', sans-serif;
  display: flex;
  align-items: center;
  height: 50px;
  border-top: solid 1px rgba(0,0,0,0.05);
}
#burger .in a:nth-of-type(1),
#burger .in a:nth-of-type(4),
#burger .in a:nth-of-type(7) {
  border-top: none;
}
#burger .in a:before {
  content: ' ';
  background: #010101;
  width: 26px;
  height: 26px;
  background-color: #010101;
  display: block;
  margin-right: 14px;
  background-size: 14px 14px;
  background-position: center center;
  border-radius: 10px;
  background-repeat: no-repeat;
}
#burger .in a.s-b {
  justify-content: left;
}
#burger .in a.s-b:before {
  background-image: url("../img/icon-buyer.svg");
}
#burger .in a.s-s:before {
  background-image: url("../img/icon-seller.svg");
}
#burger .in a.s-dp:before {
  background-image: url("../img/icon-dp.svg");
}
#burger .in a.r-b:before {
  background-image: url("../img/icon-blog.svg");
  background-size: 13px 13px;
}
#burger .in a.r-hbb:before {
  background-image: url("../img/icon-hbblog.svg");
  background-size: 18px;
}
#burger .in a.r-r:before {
  background-image: url("../img/icon-resources.svg");
  background-size: 13px 13px;
}
#burger .in a.c-a:before {
  background-image: url("../img/icon-about.svg");
}
#burger .in a.c-c:before {
  background-image: url("../img/icon-careers.svg");
  background-size: 14px 14px;
  background-position: 50% 40%;
}
#burger .in a.c-p:before {
  background-image: url("../img/icon-press.svg");
}
@media only screen and (min-width: 1024px) and (max-width: 1300px) {
  .w,
  header nav ul li .dd .g-m {
    width: 1024px;
  }
  header nav ul li .dd .g-m .three {
    grid-column-end: span 4;
  }
  .m-hero-home .meta .six {
    height: 500px;
  }
  .m-hero-home .meta .six h1 {
    padding-left: 30px;
    font-size: 60px;
  }
  .m-hero-home .graphics {
    margin-top: -450px;
  }
  .m-hero-home .graphics .img {
    height: 400px;
  }
  .m-hero-home .graphics .bg {
    height: 500px;
    margin-top: -450px;
  }
  .m-solutions-index .heading {
    width: 100%;
  }
}
@media only screen and (min-width: 901px) and (max-width: 1023px) {
  .w,
  header nav ul li .dd .g-m {
    width: 900px;
  }
  header nav ul li .dd .g-m .three {
    grid-column-end: span 4;
  }
  .m-hero-home .meta .six {
    height: 500px;
  }
  .m-hero-home .meta .six h1 {
    padding-left: 0;
    font-size: 55px;
  }
  .m-hero-home .graphics {
    margin-top: -450px;
  }
  .m-hero-home .graphics .img {
    height: 400px;
  }
  .m-hero-home .graphics .bg {
    height: 500px;
    margin-top: -450px;
  }
  .m-solutions-index .heading {
    width: 100%;
  }
}
@media only screen and (max-width: 900px) {
  .w,
  .ww {
    width: calc(100% - 30px);
  }
  .g,
  .g-m,
  .g-l,
  .g-n {
    display: block;
  }
  .g .one,
  .g-m .one,
  .g-l .one,
  .g-n .one,
  .g .two,
  .g-m .two,
  .g-l .two,
  .g-n .two,
  .g .three,
  .g-m .three,
  .g-l .three,
  .g-n .three,
  .g .four,
  .g-m .four,
  .g-l .four,
  .g-n .four,
  .g .five,
  .g-m .five,
  .g-l .five,
  .g-n .five,
  .g .six,
  .g-m .six,
  .g-l .six,
  .g-n .six,
  .g .seven,
  .g-m .seven,
  .g-l .seven,
  .g-n .seven,
  .g .eight,
  .g-m .eight,
  .g-l .eight,
  .g-n .eight,
  .g .nine,
  .g-m .nine,
  .g-l .nine,
  .g-n .nine,
  .g .ten,
  .g-m .ten,
  .g-l .ten,
  .g-n .ten,
  .g .eleven,
  .g-m .eleven,
  .g-l .eleven,
  .g-n .eleven {
    grid-column-end: span 12;
  }
  a.cta {
    width: 100%;
  }
  h1 {
    font-size: 42px;
  }
  h2 {
    font-size: 30px;
    line-height: 1.4;
  }
  h3 {
    font-size: 26px;
  }
  h4 {
    font-size: 18px;
  }
  header {
    height: 50px;
  }
  header#home {
    background: #010101;
  }
  header#home h1 a {
    background: url("../img/logo-light.svg");
    background-size: 56px;
  }
  header#home a.menu {
    background: url("../img/icon-menu-light.svg");
  }
  header#home .w {
    height: 50px;
  }
  header h1 a {
    width: 56px;
    height: 19px;
    background: url("../img/logo-dark.svg");
    background-size: 56px;
  }
  header nav,
  header a.contact {
    display: none;
  }
  header a.menu {
    display: block;
    width: 32px;
    height: 17px;
    background: url("../img/icon-menu.svg");
    font-size: 0;
  }
  .m-sub a {
    display: none;
  }
  .m-sub strong {
    border-right: none;
  }
  .m-index {
    display: none;
  }
  .m-hero {
    background-position: center center;
    background-size: cover;
    background-image: url("/etcs/uploads/ill-5.svg") !important;
  }
  .m-hero .w {
    padding: 0;
    background: transparent;
    height: 350px;
  }
  .m-hero .w p {
    font-size: 23px;
    line-height: 1.4;
    margin: 5px 0 0 0;
    width: 95%;
    opacity: 0.7;
  }
  footer .top {
    padding: 50px 0;
  }
  footer .links {
    display: none;
  }
  footer .heel {
    display: block;
    height: 60px;
  }
  footer .heel .meta {
    width: 100%;
    display: flex;
    align-items: center;
    height: 60px;
    padding: 25px 0;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: center;
  }
  footer .heel h1 {
    margin: 0 auto;
    display: none;
    width: 58px;
  }
  .m-center {
    padding: 50px 0;
  }
  .m-center h6,
  .m-center h2,
  .m-center h3 {
    padding: 0px 20px;
  }
  .m-features .set {
    max-width: 100%;
    padding: 0 0 30px 0;
  }
  .m-features .set .heading p {
    font-size: 25px;
    margin: 10px 0 0 0;
    line-height: 1.4;
  }
  .m-features .set .meta {
    height: auto;
  }
  .m-features .set .img {
    height: 280px;
    margin: 30px 0;
  }
  .m-features .set .img img {
    max-width: 100%;
    max-height: 100%;
  }
  .m-join {
    background: #010101;
  }
  .m-join .meta {
    background: #010101;
  }
  .m-join .meta .six {
    height: 280px;
    padding-bottom: 20px;
  }
  .m-join .meta .six h2 {
    margin: 0 0 18px 0;
  }
  .m-join .graphics {
    margin: 0;
  }
  .m-join .graphics .bg {
    display: none;
  }
  .m-join .graphics .img {
    height: 220px;
  }
  .m-hero-page {
    background: #010101;
    padding-bottom: 320px;
    margin: 20px 0 0 0;
  }
  .m-hero-page .meta {
    margin: 0 auto;
    z-index: 3;
  }
  .m-hero-page .meta .six {
    height: 280px;
    padding: 20px 0;
    justify-content: space-evenly;
    padding-top: 250px;
  }
  .m-hero-page .meta .six label {
    padding: 0 0 10px 0;
    font-size: 10px;
    width: 100%;
    border-bottom: solid 2px #fff;
    background: transparent;
    color: #fff;
    text-align: left;
    text-transform: none;
    letter-spacing: 0;
    font-size: 15px;
  }
  .m-hero-page .meta .six a.author {
    font-size: 17px;
    line-height: 1.4;
  }
  .m-hero-page .meta .six a.author .img {
    width: 40px;
    height: 40px;
    border-radius: 18px;
    margin-right: 15px;
  }
  .m-hero-page .graphics {
    margin: 0;
  }
  .m-hero-page .graphics width,
  .m-hero-page .graphics .img {
    width: 100%;
    height: 250px;
    margin-top: -570px;
  }
  .m-hero-page .graphics .bg {
    display: none;
  }
  .m-categories {
    padding: 40px 0;
  }
  .m-categories a,
  .m-categories em {
    font-size: 28px;
  }
  .m-categories em:last-of-type {
    display: none;
  }
  .m-posts .post {
    margin-bottom: 15px;
  }
  .m-hero .w h6,
  .m-hero .w h2 {
    width: 100%;
  }
  .m-resources {
    padding: 50px 0;
  }
  .m-resources .row {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-bottom: none;
    padding-bottom: 50px;
  }
  .m-resources .row .three {
    width: 100%;
    border-bottom: solid 1.5px #010101;
    height: 30px;
  }
  .m-resources .row .three p {
    display: none;
  }
  .m-resources .row .four {
    width: 100%;
    height: 160px;
    margin: 15px 0 15px 0;
    overflow: hidden;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }
  .m-resources .row .four img {
    width: 100%;
    max-width: 100%;
  }
  .m-resources .row .five {
    width: 100%;
  }
  .m-download {
    padding: 40px 0 40px 0;
  }
  .m-download .form form {
    margin: 30px 0 0 0;
  }
  .m-download .form form input {
    font-size: 18px;
    padding: 14px 0;
  }
  .m-download .form form input.button {
    margin: 30px 0 0 0;
  }
  .m-download .img {
    margin: -830px 0 540px 0;
    background: #f5f6f5;
    display: flex;
    display: none;
    justify-content: center;
  }
  .m-download .img img {
    max-height: 300px;
    float: none;
    margin: 0 auto;
  }
  .m-intro {
    height: 350px;
  }
  .m-intro h6,
  .m-intro h2 {
    width: 100%;
  }
  .m-dna {
    height: 100%;
    padding: 50px 0;
  }
  .m-dna .meta {
    margin-bottom: 30px;
  }
  .m-dna .list ul li strong {
    font-size: 20px;
  }
  .m-seals {
    padding: 50px 0;
  }
  .m-seals .g-m {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .m-seals .g-m .heading {
    width: 100%;
    height: 50px;
  }
  .m-seals .g-m .membership,
  .m-seals .g-m .accreditation {
    background: #f5f6f5;
    width: 100%;
    margin-bottom: 15px;
  }
  .m-seals .g-m .membership strong,
  .m-seals .g-m .accreditation strong {
    padding: 20px 20px 0px 20px;
    font-size: 22px;
    border-bottom: none;
    opacity: 0.5;
  }
  .m-seals .g-m .membership img,
  .m-seals .g-m .accreditation img {
    height: 80px;
  }
  .m-seals .g-m .membership img img,
  .m-seals .g-m .accreditation img img {
    max-width: 100%;
    max-height: 100%;
  }
  .m-team {
    padding: 50px 0;
  }
  .m-team .twelve {
    margin: 0 0 30px 0;
  }
  .m-team .twelve h2 {
    width: 100%;
  }
  .m-team .g-n {
    display: flex;
    flex-wrap: wrap;
  }
  .m-team .g-n .member {
    width: 50%;
    font-size: 15px;
    height: 340px;
  }
  .m-team .g-n .member .photo {
    height: 250px;
  }
  .m-mentions {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .m-mentions .mention {
    margin-bottom: 15px;
    width: calc(50% - 7.5px);
  }
  .m-mentions .mention a {
    padding: 10px;
    height: 240px;
  }
  .m-hero-home {
    margin: 0;
    background: #010101;
  }
  .m-hero-home .graphics {
    margin: 0;
  }
  .m-hero-home .graphics .bg {
    display: none;
  }
  .m-hero-home .graphics .img {
    height: auto;
  }
  .m-hero-home .graphics .img img {
    max-width: 100%;
    display: block;
  }
  .m-hero-home .meta .six {
    margin: 0;
    height: 250px;
  }
  .m-hero-home .meta .six h1 {
    font-size: 39px;
    padding-left: 0;
    color: #fff;
  }
  .m-solutions-index {
    padding: 40px 0 0 0;
  }
  .m-solutions-index .heading {
    width: 100%;
  }
  .m-solutions-index .heading h2 {
    width: 90%;
  }
  .m-solutions-index .g .m-card a .meta {
    height: 380px;
    margin: 0 0 15px 0;
    padding: 0px 50px;
  }
  .m-solutions-index .g .m-card a .img {
    width: 100px;
    height: 100px;
    background-size: 100px;
    margin: 0 auto 30px auto;
  }
  .m-bar {
    height: 150px;
    bottom: 15px;
    left: 15px;
    width: calc(100% - 60px);
    background-image: none;
  }
  .m-bar a {
    width: 100%;
  }
  .m-bar a.close {
    top: 15px;
    right: 15px;
  }
  .m-jobs {
    padding: 30px 0;
  }
  .m-jobs ul#departments li h2 {
    font-size: 18px;
  }
  .m-jobs ul#departments li ul li {
    padding: 16px 0;
    font-size: 16px;
  }
  .m-jobs ul#departments li ul li a {
    line-height: 145%;
    margin-bottom: 4px;
  }
  .m-hero-cats .w .flex {
    display: block;
  }
  .m-hero-cats .w .flex .img {
    width: 80px;
    height: 80px;
    border-radius: 32px;
    margin-bottom: 20px;
  }
  .m-posts-cats {
    padding: 20px 0 0 0;
  }
  .m-hero-hbb {
    background-size: 100%;
  }
  .m-hero-hbb h2 {
    width: 350px;
    height: 43px;
    background-size: 100%;
    background-repeat: none;
  }
}
.m-hero-dp .w .six {
  height: 450px;
}
.m-hero-dp .w .features {
  padding: 0 0 30px 0;
  font-size: 29px;
}
