/*Theme Name: Hanzo*/
/*Author: Ian Loats @ Design Motive*/
/*Author URI: https://designmotive.co.uk */
/*Version: 3.0*/
/* Hanzo colours */
/* Hanzo Text Size - Full Screen */
::-webkit-scrollbar {
  -webkit-appearance: none;
  width: 12px;
}

::-webkit-scrollbar-track {
  background-color: #ffffff;
  border-radius: 0;
}

::-webkit-scrollbar-thumb {
  border-radius: 0;
  background-color: #3c3c3c;
}

* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  box-sizing: border-box;
  margin: 0;
}

html, body {
  font-family: "Onest", sans-serif;
  margin: 0;
  padding: 0;
  color: #000000;
  text-align: left;
}

h1 {
  font-size: 82px;
  line-height: 92px;
/*   letter-spacing: -0.03em; */
  padding: 0.25em 0;
  color: blue;
  font-weight: 300;
}

h2, .single h1, h1.wp-block-heading {
  font-size: 45px;
  line-height: 55px;
/*   letter-spacing: -0.03em; */
  padding: 0 0 0.5em;
  color: blue;
  font-weight: 300;
}

h3 {
  font-size: 30px;
  line-height: 40px;
  letter-spacing: -0.03em;
  padding: 0.5em 0;
  color: #000000;
  font-weight: 700;
}

h4 {
  font-size: 30px;
  line-height: 40px;
  letter-spacing: -0.03em;
  padding: 0 0 1em;
  color: blue;
  font-weight: 600;
}

h5, p.subhead {
  font-size: 22px;
  line-height: 32px;
  letter-spacing: -0.03em;
  padding: 0.25em 0;
  color: blue;
  font-weight: 700;
}

p {
  font-size: 18px;
  line-height: 37px;
  letter-spacing: -0.01em;
  padding: 0 0 1em;
  font-weight: 300;
}

a {
  color: #000000;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}

a:hover {
  color: #ff006f;
  text-decoration-line: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: 5px;
}

h3 a {
  color: blue;
  text-decoration: none;
}

h3 a:hover {
  color: #ff006f;
  text-decoration-line: none;
}

strong {
  font-weight: 700;
}

p strong {
  font-weight: 600;
}

hr {
  border-top: 1px solid #f0f0f0;
  margin: 2em 0;
}

ul, ol {
  padding: 0 0 0 1.5em;
}

ul li, ol li {
  font-size: 25px;
  line-height: 37px;
  letter-spacing: -0.01em;
  padding: 0 0 1em;
  font-weight: 300;
}

/* menu start */
#sidebarMenu {
  height: 100%;
  position: fixed;
  right: 0;
  top: 0;
  width: 25vw;
  transform: translateX(25vw);
  transition: transform 250ms ease-in-out;
  background: blue;
  z-index: 100;
  display: flex;
  justify-content: flex-start;
  align-items: center;
}

.sidebarMenuInner {
  margin: 0;
  padding: 0;
}

.sidebarMenuInner li {
  list-style: none;
  padding: 0.5em 40px;
  cursor: pointer;
  text-align: left;
}

.sidebarMenuInner li a {
  font-size: 30px;
  line-height: 40px;
  color: #ffffff;
  cursor: pointer;
  text-decoration: none;
  font-family: "Poppins", sans-serif;
}

.sidebarMenuInner li a:hover {
  color: #ff006f;
}

input[type=checkbox]:checked ~ #sidebarMenu {
  transform: translateX(0);
}

input[type=checkbox] {
  transition: all 0.3s;
  box-sizing: border-box;
  display: none;
}

.sidebarIconToggle {
  transition: all 0.3s;
  box-sizing: border-box;
  cursor: pointer;
  position: fixed;
  z-index: 700;
  height: 100%;
  width: 100%;
  top: 50px;
  right: 40px;
  height: 22px;
  width: 22px;
}

.spinner {
  transition: all 0.3s;
  box-sizing: border-box;
  position: absolute;
  height: 3px;
  width: 100%;
  background-color: #ffffff;
}

.horizontal {
  transition: all 0.3s;
  box-sizing: border-box;
  position: relative;
  float: left;
  margin-top: 3px;
}

.diagonal.part-1 {
  position: relative;
  transition: all 0.3s;
  box-sizing: border-box;
  float: left;
}

.diagonal.part-2 {
  transition: all 0.3s;
  box-sizing: border-box;
  position: relative;
  float: left;
  margin-top: 3px;
}

input[type=checkbox]:checked ~ .sidebarIconToggle > .horizontal {
  transition: all 0.3s;
  box-sizing: border-box;
  opacity: 0;
}

input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-1 {
  transition: all 0.3s;
  box-sizing: border-box;
  transform: rotate(135deg);
  margin-top: 8px;
}

input[type=checkbox]:checked ~ .sidebarIconToggle > .diagonal.part-2 {
  transition: all 0.3s;
  box-sizing: border-box;
  transform: rotate(-135deg);
  margin-top: -9px;
}

.sidebarMenuInner li.active a {
  color: #ff006f;
}

/* menu end */
header.navigation {
  display: flex;
  flex-flow: row;
  justify-content: space-between;
  align-items: center;
  padding: 20px 40px;
  width: 100%;
  max-width: 100%;
  box-shadow: none;
  position: fixed;
  height: 116px;
  z-index: 200;
  top: 0;
  transition: top 0.25s ease-in-out, background-color 0.25s linear;
  background-color: transparent;
}

.scrolled header {
  background-color: #060c3e;
}

a.btn {
  font-size: 22px;
  line-height: 32px;
  background-color: blue;
  padding: 0.5em 1.5em;
  color: #060c3e;
  text-decoration: none;
}

a.btn.mag {
  background-color: #c71fe4;
}

a.btn.grn {
  background-color: #00b316;
}

a.btn.wht {
  background-color: #ffffff;
  color: blue;
}

a.btn.blu {
  color: #ffffff;
}

a.btn:hover {
  color: #ffffff;
}

a.btn.wht:hover {
  background-color: #ff006f;
}

a.btn.blu:hover {
  background-color: #ff006f;
}

.wp-block-button__link {
  font-size: 22px;
  line-height: 32px;
  background-color: blue;
  padding: 0.5em 1.25em 0.4em;
  color: #ffffff;
  text-decoration: none;
  border-radius: 0;
}

.wp-block-button__link:hover {
  background-color: #ff006f;
  color: #ffffff;
  text-decoration: none;
}

.wp-block-image img {
  margin-bottom: 2em;
}

button.tagsbtn {
  font-size: 15px;
  line-height: 22px;
  background-color: #ddd;
  padding: 0.5em 1em;
  margin: 0 8px 8px 0;
  text-decoration: none;
  box-sizing: border-box;
  cursor: pointer;
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  border: 0;
  border-radius: 0;
  text-align: left;
  width: fit-content;
}

button.tagsbtn:hover {
  background-color: #ff006f;
  color: #ffffff;
}

a.readmore {
    background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore.svg");
    background-repeat: no-repeat;
    background-position: 100% 50%;
    background-size: 25px 21.5px;
    padding-right: 32px;
    text-decoration: none;
    font-size: 25px;
    line-height: 37px;
    letter-spacing: -0.01em;
    font-weight: 300;
}

a.readmore:hover {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-mag.svg");
}

a.readmore.illuminate {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-illuminate.svg");
  color: #ffffff;
}

a.readmore.illuminate:hover {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-mag.svg");
  color: #ff006f;
}

a.readmore.chronicle {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-chronicle.svg");
  color: #ffffff;
}

a.readmore.chronicle:hover {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-mag.svg");
  color: #ff006f;
}

.page-id-39 a.readmore {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-illuminate.svg");
}

.page-id-39 a.readmore:hover {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-mag.svg");
}

.page-id-41 a.readmore {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-chronicle.svg");
}

.page-id-41 a.readmore:hover {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-mag.svg");
}

button.tagbtn {
  font-size: 15px;
  line-height: 22px;
  background-color: blue;
  padding: 0.5em 1.25em 0.4em;
  margin: 0 10px 10px 0;
  color: #ffffff;
  text-decoration: none;
  box-sizing: border-box;
  cursor: pointer;
  font-family: "Poppins", sans-serif;
  font-weight: 300;
  border: 0;
  border-radius: 0;
}

button.tagbtn:hover {
  background-color: #ff006f;
  color: #ffffff;
}

.tagwrap {
  margin: 0 20px;
}

p.pgbtn {
  padding: 1em 0 2em;
}

p.pgbtn a {
  font-size: 22px;
  line-height: 32px;
  font-family: "Poppins", sans-serif;
  font-weight: 700;
  color: #ffffff;
  background-color: #c71fe4;
  text-decoration: none;
  padding: 0.5em 1.25em 0.4em;
  margin: 0;
  box-sizing: border-box;
  cursor: pointer;
  border: 0;
  border-radius: 0;
}

p.pgbtn a:hover {
  background-color: fuchsia;
}

p.sml, .hero p.sml {
  font-size: 22px;
  line-height: 32px;
}

.page-id-39 main h2, .page-id-39 main h4, .page-id-39 main h5, .page-id-1695 main h2, .page-id-1695 main h4, .page-id-1695 main h5 {
  color: #c71fe4;
}

.page-id-41 main h2, .page-id-41 main h4, .page-id-41 main h5 {
  color: #00b316;
}

.hero {
  width: 100%;
  height: 100vh;
  background-color: #060c3e;
  height: 100vh;
  position: relative;
  overflow: hidden;
}

.hero h1, .hero p {
  color: #ffffff;
}

.hero p {
  font-size: 30px;
  line-height: 40px;
  padding-bottom: 0.25em;
}

.heroimgwrap {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

.heroimgwrap img {
  display: block;
  width: 100%;
  height: 100vh;
  -o-object-fit: cover;
  object-fit: cover;
  font-family: "object-fit: cover;";
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
}

.hero-content {
  width: 100vw;
  height: 100vh;
  position: relative;
  z-index: 1;
  display: flex;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  padding: 0 90px;
}

.hdlogo {
  z-index: 2;
}

.hdlogo img {
  width: 225px;
  height: 76px;
}

.svgar {
  position: absolute;
  right: 30px;
  bottom: 30px;
  width: 26px;
  height: 67px;
  z-index: 2;
}

a.svgar svg path {
  fill: #ffffff;
  transition: transform 0.2s ease;
}

a.svgar:hover svg path {
  fill: #ff006f;
  transform: translateY(10px);
}

.hero.sub .hero-content {
  justify-content: flex-end;
  align-items: flex-start;
  padding: 6em 90px;
}

.subhero {
  width: 100%;
  height: 60vh;
  background-color: #060c3e;
  display: flex;
  flex-flow: column;
  justify-content: flex-end;
  align-items: flex-start;
  padding: 2em 90px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 50% 50%;
  position: relative;
  overflow-x: hidden;
}

.subhero.cathero {
  height: 35vh;
}

.subhero h1, .subhero h5 {
  color: #ffffff;
  z-index: 2;
}

.subhero h5 {
  font-size: 30px;
  line-height: 40px;
}

.subhero p {
  color: #ffffff;
  z-index: 2;
  font-size: 30px;
  line-height: 40px;
  letter-spacing: -0.03em;
  padding: 0.25em 0;
  font-weight: 700;
}

.herosvg {
  position: absolute;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
}

.herosvgwrap {
  position: absolute;
  top: 0;
  right: -8px;
  bottom: 0;
  left: -8px;
}

.herosvgwrap img {
  display: block;
  width: 100%;
  height: 60vh;
  -o-object-fit: cover;
  object-fit: cover;
  font-family: "object-fit: cover;";
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
}

ul.sectionmenu {
  padding: 1.5em 0;
}

ul.sectionmenu li {
  display: inline;
  padding: 0 2em;
  font-size: 18px;
  line-height: 28px;
}

ul.sectionmenu li a {
  text-decoration: none;
}

main {
  background-color: #ffffff;
}

.blog main, .single main, .archive main {
  background-color: #f0f0f0;
}

.boxfloat .slimwrap {
  background-color: #ffffff;
}

.newsarticle {
  display: flex;
  flex-flow: row wrap;
  margin: 2em -20px;
}

article {
  flex: 0 0 75%;
  padding: 0 20px;
}

aside {
  flex: 0 0 25%;
  padding: 0 20px;
}

.tagbox {
  background-color: #f0f0f0;
  padding: 16px 16px 24px;
  margin: 3em 0;
}

.teamimgwrap {
  position: relative;
  width: 98px;
  height: 98px;
  overflow: hidden;
  border-radius: 50%;
  margin: 0;
}

.teamimgwrap img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.aboutimgwrap {
  position: relative;
  width: 240px;
  height: 240px;
  overflow: hidden;
  border-radius: 50%;
  margin: 0 auto 1em;
}

.aboutimgwrap > img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

img.author-socials {
  width: 40px;
  height: 40px;
  margin-right: 5px;
}

.single-img {
  width: 100%;
  height: auto;
  margin: 0 0 2em;
}

.slimwrap {
  max-width: 1212px;
  margin: 0 auto;
  padding: 0 40px;
}

.wrap {
  max-width: 1700px;
  margin: 0 auto;
  padding: 0 40px;
}

.newspage {
  margin-top: -40vh;
  position: relative;
  z-index: 10;
  padding-top: 2em;
  background-color: #ffffff;
  padding-bottom: 2em;
}

.newspage h1 {
  padding: 0.5em 0;
}

.two-col {
  display: flex;
  flex-flow: row wrap;
  margin: 0 -100px;
}

.two-col > div {
  flex: 0 0 50%;
  padding: 3em 100px;
}

.two-col-page {
  display: flex;
  flex-flow: row wrap;
  margin: 0 -20px;
}

.two-col-page > div {
  flex: 0 0 50%;
  padding: 0 20px 2em;
}

.page-id-1314 .two-col-page > div {
  display: inline-flex;
  justify-content: center;
  flex-flow: column;
}

.page-id-39 .two-col-page > div, .page-id-41 .two-col-page > div {
  padding-bottom: 4em;
}

.two-col-page.smlp p {
  font-size: 18px;
  line-height: 28px;
}

.two-col-page.searchbox {
  margin-top: 2em;
  margin-bottom: 1em;
}

.two-col-page.searchbox P {
  padding: 0 0 0.25em;
}

.two-col-page.mtt > div {
  text-align: center;
  margin-bottom: 2em;
}

.rgt {
  text-align: right;
}

img.report {
  width: 60%;
  height: auto;
  margin-bottom: 0.5em;
}

.cntr {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  position: relative;
  min-height: 340px;
}

.cntr img {
  position: absolute;
  left: 0;
  width: 100%;
  height: auto;
}

.cntr h2 {
  z-index: 2;
  text-align: center;
}

.cntrbtn {
  text-align: center;
}

.cntrbtn a.btn {
  margin: 0 0.5em;
  line-height: 55px;
}

.three-col {
  display: flex;
  flex-flow: row wrap;
  margin: 2em -20px;
}

.three-col > div {
  flex: 0 0 33.33%;
  padding: 20px;
}

.three-col p {
  font-size: 18px;
  line-height: 28px;
}

.miniicon {
  width: 86px;
  height: 60px;
  display: inline-flex;
  align-items: flex-start;
}

.miniicon img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
  object-fit: contain;
  font-family: "object-fit: contain;";
  -o-object-position: 0% 100%;
  object-position: 0% 100%;
}

.diagwrap {
  background-color: #f0f0f0;
  width: 100%;
  min-height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 2em;
}

.diagwrap img {
  width: 100%;
  height: 100%;
  max-height: 200px;
  max-width: 260px;
}

section {
  padding: 4em 0;
}

section.npt {
  padding: 0 0 4em;
}

section.npd {
  padding: 0;
}

section.npb {
  padding: 4em 0 0;
}

section.drkblue {
  background-color: #060c3e;
}

section.drkblue h3, section.drkblue h4, section.drkblue h2, section.drkblue p {
  color: #ffffff;
}

section.drkblue .slimwrap {
  text-align: center;
  background-color: transparent;
}

section.midblue {
  background-color: blue;
}

section.midblue h3, section.midblue h2, section.midblue p {
  color: #ffffff;
}

section.midblue .slimwrap {
  text-align: center;
  background-color: transparent;
}

section.grey {
  background-color: #f0f0f0;
}

section.grey h3, section.grey p {
  color: blue;
}

section.grey .slimwrap {
  text-align: center;
  background-color: transparent;
}

.page-id-39 section.grey p, .page-id-41 section.grey p {
  color: #000000;
}

section.mag {
  background-color: #c71fe4;
}

section.mag h2, section.mag h5, section.mag p {
  text-align: center;
  color: #ffffff;
}

section.grn {
  background-color: #00b316;
}

section.grn h2, section.grn h5, section.grn p {
  text-align: center;
  color: #ffffff;
}

.movie {
  width: 100%;
  height: 600px;
  background-color: #f0f0f0;
}

.logos {
  display: flex;
  flex-flow: row wrap;
  margin: 1em -2em 4em;
  justify-content: center;
}

.logos > img {
  flex: 0 0 calc(16.66% - 4em);
  height: 55px;
  margin: 2em;
}

.usecase {
  margin: 2em 3em;
  background-color: #ffffff;
  border: 2px solid #c71fe4;
  display: flex !important;
  flex-flow: row wrap;
}

.usecase > div {
  flex: 0 0 50%;
  text-align: left;
  padding: 40px;
}

.usecase > div:nth-child(1) {
  background-color: #c71fe4;
}

.usecase > div:nth-child(1) p {
  color: #ffffff;
}

.usecase > div p {
  font-size: 18px;
  line-height: 28px;
}

.usecase .usecaselogo {
  height: 50px;
  margin-bottom: 20px;
}

.usecase > div:nth-child(2) {
  padding-top: 110px;
}

.usecase > div:nth-child(2) h2 {
  font-size: 78px;
  line-height: 88px;
  font-weight: 400;
  padding: 0.25em 0;
}

.page-id-41 .usecase {
  border: 2px solid #00b316;
}

.page-id-41 .usecase > div:nth-child(1) {
  background-color: #00b316;
}

.slick-dots li button:before {
  color: #c71fe4;
  font-size: 12px;
}

.slick-dots li.slick-active button:before {
  color: #c71fe4;
  font-size: 12px;
}

.prevnext {
  z-index: 1;
  margin: 0;
  width: 18px;
  height: 29px;
  font-size: 0;
  line-height: 0;
  position: absolute;
  top: 50%;
  padding: 0;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  cursor: pointer;
  color: transparent;
  border: none;
  outline: none;
  background: transparent;
  left: 4px;
}

.next {
  right: 4px;
  left: unset;
}

main form {
  margin: 1em 0;
}

main form input[type=email], main form input[type=text], main form input[type=tel], main form textarea {
  font-family: "Poppins", sans-serif;
  display: inline-block;
  padding: 10px 15px;
  font-size: 18px;
  border-radius: 0;
  -webkit-appearance: none;
  font-weight: 400;
  border: 0;
  height: auto;
  margin: 0.25em 0 1em;
  outline: 0 none;
  width: 100%;
  background: #f0f0f0;
  color: #000000;
  display: inline-block;
}

main form label {
  font-family: "Poppins", sans-serif;
  color: #000000;
  font-size: 18px;
  font-weight: 400;
}

main form input[type=submit] {
  font-family: "Poppins", sans-serif;
  color: #ffffff;
  background-color: blue;
  padding: 0.5em 1em;
  font-size: 18px;
  border-radius: 0;
  -webkit-appearance: none;
  font-weight: 400;
  height: auto;
  border: 0;
  margin: 0;
  cursor: pointer;
  display: inline-block;
  border: 0;
}

main form input[type=submit]:hover {
  color: #ffffff;
  background-color: #ff006f;
}

form {
  margin: 2em 0;
}

form input[type=email], form input[type=text], form input[type=tel], form textarea {
  font-family: "Poppins", sans-serif;
  display: inline-block;
  padding: 5px 10px;
  font-size: 18px;
  border-radius: 0;
  -webkit-appearance: none;
  font-weight: 400;
  border: 0;
  height: auto;
  margin: 0.25em 0 1em;
  outline: 0 none;
  width: 100%;
  background: #ffffff;
  color: blue;
  display: inline-block;
}

form label {
  font-family: "Poppins", sans-serif;
  color: #ffffff;
  font-size: 22px;
  font-weight: 600;
}

form input[type=submit] {
  font-family: "Poppins", sans-serif;
  color: blue;
  background-color: #ffffff;
  padding: 0.5em 1em;
  font-size: 22px;
  border-radius: 0;
  -webkit-appearance: none;
  font-weight: 400;
  height: auto;
  border: 0;
  margin: 0;
  cursor: pointer;
  display: inline-block;
  border: 0;
}

form input[type=submit]:hover {
  color: #ffffff;
  background-color: #ff006f;
}

select,.searchandfilter select.sf-input-select {
  background-color: #ddd;
  color: #000000;
  padding: 0.5em 2em 0.5em 1em;
  border: 0;
  cursor: pointer;
  border-radius: 0;
  text-decoration: none;
  font-size: 15px;
  line-height: 20px;
  min-height: 40px;
  font-weight: 300;
  font-family: "Poppins", sans-serif;
  appearance: none;
  background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpolyline points='6 9 12 15 18 9'%3e%3c/polyline%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 1em;
  min-width: 100%;
}

.blogroll {
  display: flex;
  flex-flow: row wrap;
  margin: 0 -20px;
}

.blogroll > div {
  flex: 0 0 calc(33.33% - 40px);
  padding: 0;
  margin: 20px;
  display: inline-flex;
  flex-flow: column;
  background-color: #ffffff;
  justify-content: space-between;
  position: relative;
  text-align: left;
  padding-bottom: 1em;
}

.blogroll a img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  margin-bottom: 10px;
}

.blogroll a.btn, .newspage a.btn {
  font-size: 15px;
  line-height: 22px;
}

.blogroll a.readmore {
  background-size: 17px 15px;
  padding-right: 22px;
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore.svg");
}

.blogroll a.readmore:hover {
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-mag.svg");
}

.blogroll > div h3 {
  padding-left: 20px;
  padding-right: 20px;
  font-size: 22px;
  line-height: 32px;
}

.blogroll > div h3 a {
  text-decoration: none;
  color: blue;
}

.blogroll > div h3 a:hover {
  color: #ff006f;
}

.blogroll > div p {
  padding: 1em 20px;
  font-size: 15px;
  line-height: 22px;
  color: #000000;
}

.accordion {
  font-family: "Poppins", sans-serif;
  font-size: 30px;
  line-height: 40px;
  font-weight: 600;
  color: blue;
  background-color: #f0f0f0;
  cursor: pointer;
  padding: 1em 20px;
  width: 100%;
  text-align: left;
  border: none;
  outline: none;
  transition: 0.4s;
  margin: 0;
  letter-spacing: -0.03em;
}

.page-id-39 .accordion, .page-id-1695 .accordion {
  color: #c71fe4;
}

.page-id-41 .accordion {
  color: #00b316;
}

.aactive, .accordion:hover, .accordion:focus {
  color: blue;
  background-color: #f0f0f0;
}

.page-id-39 .aactive, .page-id-39 .accordion:hover, .page-id-39 .accordion:focus, .page-id-1695 .aactive, .page-id-1695 .accordion:hover, .page-id-1695 .accordion:focus {
  color: #c71fe4;
  background-color: #f0f0f0;
}

.page-id-41 .aactive, .page-id-41 .accordion:hover, .page-id-41 .accordion:focus {
  color: #00b316;
  background-color: #f0f0f0;
}

.panel {
  padding: 0 20px;
  margin: 0 0 2em;
  background-color: #f0f0f0;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
}

.accordion:before {
  float: right;
  content: " ";
  margin-left: 5px;
  width: 35px;
  height: 35px;
  background-image: url("/wp-content/themes/hanzo/img/accordion_plus.svg");
  background-repeat: no-repeat;
}

.aactive:before {
  width: 35px;
  height: 35px;
  background-image: url("/wp-content/themes/hanzo/img/accordion_minus.svg");
  background-repeat: no-repeat;
}

.page-id-39 .accordion:before, .page-id-1695 .accordion:before {
  background-image: url("/wp-content/themes/hanzo/img/accordion_plus-illuminate.svg");
}

.page-id-39 .aactive:before, .page-id-1695 .aactive:before {
  background-image: url("/wp-content/themes/hanzo/img/accordion_minus-illuminate.svg");
}

.page-id-41 .accordion:before {
  background-image: url("/wp-content/themes/hanzo/img/accordion_plus-chronicle.svg");
}

.page-id-41 .aactive:before {
  background-image: url("/wp-content/themes/hanzo/img/accordion_minus-chronicle.svg");
}

div.heroimg {
  width: 100% !important;
  height: 50vh;
  overflow: hidden;
  position: relative;
  padding: 0;
}

div.heroimg > img {
  display: block;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  font-family: "object-fit: cover;";
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
  transition: all 0.4s;
}

section.boxfloat {
  margin-top: -12em;
  position: relative;
  padding-bottom: 4em;
}

section.boxfloat .slimwrap {
  padding-top: 3em;
}

.box-col {
  display: flex;
  flex-flow: row wrap;
  margin: 0 -17px;
}

.box-col > div {
  flex: 0 0 calc(50% - 34px);
  background-color: #f0f0f0;
  margin: 17px;
  padding: 30px;
  display: inline-flex;
  flex-flow: column;
  justify-content: space-between;
  position: relative;
  min-height: 460px;
  background-image: url("/wp-content/themes/hanzo/img/box-circles.svg");
  background-position: 100% 100%;
  background-repeat: no-repeat;
}

.box-col.altcol > div {
  background-color: blue;
  background-image: url("/wp-content/themes/hanzo/img/box-circles-mag.svg");
}

.box-col > div > div:last-child {
  display: inline-flex;
  justify-content: space-between;
  align-items: flex-end;
}

.box-col > div a {
  color: #ffffff;
  text-decoration: none;
}

.box-col > div a:hover {
  color: blue;
  text-decoration: none;
}

.box-col > div h4 {
  font-size: 43px;
  line-height: 50px;
  font-weight: 700;
  padding: 0;
}

.box-col.altcol > div h4 {
  color: #ffffff;
}

.box-col > div p {
  color: #ffffff;
  padding: 0 0 0.5em;
}

.box-col > div a.button {
  color: blue;
  margin: 1em 0;
  font-size: 22px;
  line-height: 32px;
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore.svg");
  background-repeat: no-repeat;
  background-position: 100% 50%;
  background-size: 25px 21.5px;
  padding-right: 32px;
}

.box-col > div a.button:hover {
  color: #ffffff;
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-wht.svg");
}

.box-col.altcol > div a.button {
  color: #ffffff;
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-wht.svg");
}

.box-col.altcol > div a.button:hover {
  color: blue;
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore.svg");
}

.overlay {
  -webkit-transition: all 0.4s ease-in-out;
  transition: all 0.4s ease-in-out;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  background-color: blue;
  z-index: 10;
  text-align: center;
  padding: 30px;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  flex-flow: column;
}

.overlay:hover {
  opacity: 1;
}

.box-col.altcol > div .overlay {
  background-color: #f0f0f0;
}

.box-col > div .overlay:hover a.button {
  color: #ffffff;
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore-wht.svg");
}

.box-col.altcol > div .overlay:hover a.button {
  color: blue;
  background-image: url("/wp-content/themes/hanzo/img/hanzo_readmore.svg");
}

.box-col > div .overlay p {
  color: #ffffff;
  font-size: 18px;
  line-height: 28px;
  text-align: left;
}

.box-col.altcol > div .overlay p {
  color: blue;
}

.socials {
  margin: 3em 0 0;
  height: 52px;
}

.socials > a > img {
  width: 52px;
  height: 52px;
  margin-right: 10px;
}

.socials > a {
  text-decoration: none;
}

.pagesocials > a {
  text-decoration: none;
}

.searchandfilter ul {
  padding: 0;
  display: flex;
  flex-flow: row wrap;
  margin: 1em -20px 3em;
}

.searchandfilter ul li {
  flex: 0 0 50%;
  padding: 0 20px;
}

.searchandfilter label {
  display: unset;
}

.searchandfilter select.sf-input-select {
  min-width: 100%;
}

.searchandfilter h4 {
  font-size: 25px;
  line-height: 37px;
  color: #000000;
}

form.search-form {
  display: inline-flex;
  align-items: stretch;
  justify-content: center;
}

.pagesearch form.search-form input[type=submit] {
  width: 3em;
  height: auto;
  border-radius: 0;
  background-repeat: no-repeat;
  background-size: 60%;
  background-position: 50% 50%;
  font-size: unset;
}

.pagesearch form.search-form input[type=search] {
  background: #f0f0f0;
  color: #060c3e;
  font-family: "Poppins", sans-serif;
  font-size: 22px;
  line-height: 32px;
  font-weight: 400;
  border: 0;
  padding: 0.5em 1em;
}

footer {
  background-color: blue;
  padding: 4em 40px 2em;
}

.ftlogo img {
  width: 289px;
  height: 98px;
  margin: 0 0 1em;
}

.mftlogo {
  display: none;
}

footer h2, footer p {
  color: #ffffff;
}

footer a {
  color: #ffffff;
}

footer a:hover {
  color: #ff006f;
}

footer form {
  margin: 0 0 1em;
}

footer form textarea {
  max-height: 100px;
}

footer .two-col {
  margin: 0 -20px;
}

footer .two-col > div {
  padding: 0 20px;
}

footer .rgt {
  display: inline-flex;
  align-items: flex-end;
  justify-content: space-between;
  flex-flow: column;
}

.BambooHR-ATS-board {
  font-family: "Poppins", sans-serif !important;
}

.heroimgtxt {
  margin-top: -300px;
}

.page-id-1695 main .heroimgtxt h2 {
  font-size: 300px;
  color: #ffffff;
}

.hero-feature-boxes {
  display: flex;
  flex-flow: row wrap;
  width: 100%;
  margin: 2em -1em 0;
}

.hero-feature-boxes > div {
  flex: 0 0 calc(33.33% - 2em);
  background-color: #c71fe4;
  padding: 2em;
  margin: 0.5em 1em;
}

.hero-feature-boxes > div h2 {
  color: #ffffff;
  padding-bottom: 0.25em;
}

.hero-feature-boxes > div p {
  font-size: 18px;
  line-height: 28px;
}

.hero-feature-boxes > div:nth-child(1) {
  background-image: url("/wp-content/themes/hanzo/img/featurebox-dots.svg");
  background-position: 100% 0;
  background-repeat: no-repeat;
  background-size: contain;
}

.hero-feature-boxes > div:nth-child(2) {
  background-color: #ffffff;
}

.hero-feature-boxes > div:nth-child(2) h2 {
  color: #c71fe4;
}

.hero-feature-boxes > div:nth-child(2) p {
  color: #000000;
}

a.pointer {
  display: block;
  float: right;
}

a.pointer svg {
  width: 27px;
  height: 30px;
}

a.pointer:hover svg g {
  stroke: #0000FF;
}

a.pointer svg {
  transition: transform 0.2s ease;
}

a.pointer:hover svg {
  transform: translateY(10px);
}

.two-col-page > div.featurebox-one {
  background-color: #c71fe4;
  padding: 1.5em 2em 3em 2em;
  margin-bottom: 3em;
  text-align: right;
  align-self: flex-start;
  background-image: url("/wp-content/themes/hanzo/img/featurebox-dots.svg");
  background-position: 100% 0;
  background-repeat: no-repeat;
  background-size: contain;
}

.two-col-page > div.featurebox-two {
  border: 2px solid #c71fe4;
  padding: 1.5em 2em 3em 2em;
  margin-bottom: 3em;
  text-align: right;
  align-self: flex-start;
}

.two-col-page > div.featurebox-one h2 {
  color: #ffffff;
  text-align: left;
}

.two-col-page > div.featurebox-one p {
  text-align: left;
}

.two-col-page > div.featurebox-two h2 {
  text-align: left;
}

.two-col-page > div.featurebox-two p {
  text-align: left;
}

.two-col-page > div.featurebox-one a.btn {
  background-color: #ffffff;
  color: #c71fe4;
}

.two-col-page > div.featurebox-one a.btn:hover {
  background-color: blue;
  color: #ffffff;
}

.two-col-page > div.featurebox-two a.btn {
  background-color: #c71fe4;
  color: #ffffff;
}

.two-col-page > div.featurebox-two a.btn:hover {
  background-color: blue;
  color: #ffffff;
}

.grecaptcha-badge {
  visibility: hidden;
}

.vidbox {
  margin: 1em 0 3em;
}

section.gra {
  background-color: #f0f0f0;
}

section.lft h2, section.lft p {
  text-align: left;
}

section.mag p.pgbtn a {
  color: fuchsia;
  background-color: #ffffff;
}

section.mag p.pgbtn a:hover {
  background-color: fuchsia;
  color: #ffffff;
}

ul.sectionmenutwo {
  padding: 1.5em 0;
}

ul.sectionmenutwo li {
  flex: 0 0 16.66%;
  padding: 0 1.5em;
  display: inline;
  font-size: 18px;
  line-height: 28px;
}

ul.sectionmenutwo li a {
  text-decoration: none;
}

.two-col-page > div.featurebox-three {
  background-color: blue;
  padding: 1.5em 2em 6em 2em;
  margin-bottom: 3em;
  text-align: left;
  align-self: flex-start;
  min-height: 460px;
  background-repeat: no-repeat;
  background-size: cover;
}

.herobox-one {
  padding: 1.5em 2em 6em 2em;
  margin-bottom: 1em;
  text-align: left;
  min-height: 400px;
  background-repeat: no-repeat;
  background-size: cover;
}

.two-col-page > div.featurebox-three h3, .herobox-one h3 {
  font-size: 53px;
  line-height: 63px;
  letter-spacing: -0.03em;
  padding: 0 0 0.5em;
  color: #ffffff;
  font-weight: 700;
}

.hero.sub .hero-content.hero-displaybox {
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: flex-end;
}

.hero.sub .hero-content.hero-displaybox > div {
  flex: 0 0 65%;
}

.hero.sub .hero-content.hero-displaybox > div:nth-child(2) {
  flex: 0 0 calc(35% - 2em);
  padding-left: 2em;
}

.heropane {
  display: inline-flex;
  flex-flow: column;
}

@media (max-width: 1380px) {
  .heropane {
    flex-flow: row;
  }

  .heropane > div {
    flex: 0 0 50%;
  }

  .heropane > div:nth-child(2) {
    flex: 0 0 calc(50% - 2em);
    padding-left: 2em;
  }

  .hero.sub .hero-content.hero-displaybox > div {
    flex: 0 0 100%;
  }

  .hero.sub .hero-content.hero-displaybox > div:nth-child(2) {
    flex: 0 0 100%;
    padding-left: unset;
  }

  .herobox-one {
    min-height: unset;
    margin-bottom: unset;
  }
}
@media (max-width: 800px) {
  .heropane {
    flex-flow: column;
  }

  .heropane > div:nth-child(2) {
    padding-left: unset;
  }

  .herobox-one {
    margin-bottom: 1em;
  }
}
.hero.illuminate-for-scale .hero-content {
  padding: 0 90px 90px;
  justify-content: flex-end;
  position: absolute;
  top: 0;
}

.hero.illuminate-for-scale .hero-content h1 {
  font-weight: 700;
  padding: 0 20% 0.5em 0;
}

.hero.illuminate-for-scale .hero-content h2 {
  font-weight: 700;
  color: fuchsia;
  font-size: 82px;
  line-height: 92px;
  padding: 0;
}

main.illuminate-for-scale h2 {
  font-size: 48px;
  line-height: 58px;
  color: #c71fe4;
}

main.illuminate-for-scale h2.sml {
  font-size: 41px;
  line-height: 51px;
}

main.illuminate-for-scale .wp-block-button__link {
  background-color: #c71fe4;
  font-weight: 700;
}

main.illuminate-for-scale .wp-block-button__link:hover {
  background-color: #ff006f;
}

.miniicon-b {
  width: 94px;
  height: 66px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #f0f0f0;
}

.miniicon-b img {
  display: block;
  width: 80%;
  height: 80%;
  -o-object-fit: contain;
  object-fit: contain;
  font-family: "object-fit: contain;";
  -o-object-position: 50% 50%;
  object-position: 50% 50%;
}

main.illuminate-for-scale section.mag h2 {
  color: #ffffff;
  text-align: left;
  padding: 0;
}

.picblock {
  background-position: 70% 50%;
  background-repeat: no-repeat;
  background-size: cover;
  min-height: 600px;
  position: relative;
}

main.illuminate-for-scale .picblock .slimwrap {
  width: 100%;
}

main.illuminate-for-scale .picblock .slimwrap h2 {
  font-weight: 700;
  color: #ffffff;
}

.two-col-vs {
  display: flex;
  flex-flow: row wrap;
  align-items: flex-start;
}

.two-col-vs > div {
  flex: 0 0 calc(50% - 105px);
}

.two-col-vs > div:nth-child(2) {
  flex: 0 0 210px;
  padding: 0 30px;
}

.dotwrap {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

img.picblock-dots {
  position: absolute;
  top: 0;
  right: 0;
  width: 186px;
}

.textwrap {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 50px;
  left: 0;
  display: flex;
  align-items: flex-end;
}

.vs {
  width: 100%;
  height: 100%;
}

.hero.illuminate-for-scale .wp-block-button__link {
  position: absolute;
  right: 40px;
  top: 120px;
  background-color: #c71fe4;
  font-weight: 700;
}

.hero.illuminate-for-scale .wp-block-button__link:hover {
  background-color: #ff006f;
}

/* Media Queries */
@media (max-width: 1920px) {
  .two-col {
    margin: 0 -80px;
  }

  .two-col > div {
    padding: 3em 80px;
  }
}
@media (max-width: 1800px) {
  .two-col {
    margin: 0 -40px;
  }

  .two-col > div {
    padding: 2em 40px;
  }

  .hero-feature-boxes {
    width: unset;
  }

  .hero-feature-boxes > div {
    flex: 0 0 calc(50% - 2em);
  }
}
@media (max-width: 1360px) {
  footer {
    padding: 2em 40px 2em;
  }

  footer .two-col > div {
    flex: 0 0 100%;
  }

  footer .two-col > div:nth-child(1) .two-col > div {
    flex: 0 0 50%;
  }

  footer .rgt {
    align-items: flex-start;
    margin-top: 1em;
    text-align: left;
  }

  .ftlogo {
    display: none;
  }

  .mftlogo {
    display: unset;
  }

  .mftlogo img {
    width: 225px;
    height: 76px;
    margin: 0 0 2em;
  }
}
@media (max-width: 1220px) {
  .hero-content {
    padding: 0 40px;
  }

  .subhero {
    padding: 1em 40px;
  }

  .hero.sub .hero-content {
    padding: 4em 80px 4em 40px;
  }

  section {
    padding: 3em 0;
  }

  section.npt {
    padding: 0 0 3em;
  }

  section.npb {
    padding: 3em 0 0;
  }

  .page-id-39 .two-col-page > div, .page-id-41 .two-col-page > div {
    padding-bottom: 3em;
  }

  .svgar {
    right: 15px;
  }

  .hero.illuminate-for-scale .hero-content {
    padding: 0 40px 40px;
  }

  .heroimgwrap.illuminateslider .slick-track div:nth-child(1) img {
    -o-object-position: 80% 50%;
    object-position: 80% 50%;
  }

  .heroimgwrap.illuminateslider .slick-track div:nth-child(2) img {
    -o-object-position: 100% 50%;
    object-position: 100% 50%;
  }

  .heroimgwrap.illuminateslider .slick-track div:nth-child(3) img {
    -o-object-position: 80% 50%;
    object-position: 80% 50%;
  }
}
/* Hanzo Text Size - Tablet */
@media (max-width: 1180px) {
  h1 {
    font-size: 50px;
    line-height: 55px;
  }

  h2, .single h1, h1.wp-block-heading {
    font-size: 40px;
    line-height: 50px;
  }

  h3 {
    font-size: 23px;
    line-height: 30px;
  }

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

  h5, p.subhead {
    font-size: 18px;
    line-height: 27px;
  }

  p {
    font-size: 19px;
    line-height: 28px;
  }

  ul li, ol li {
    font-size: 19px;
    line-height: 28px;
  }

  .sidebarMenuInner li a {
    font-size: 23px;
    line-height: 30px;
  }

  a.btn {
    font-size: 18px;
    line-height: 27px;
  }

  p.pgbtn a {
    font-size: 18px;
    line-height: 27px;
  }

  .wp-block-button__link {
    font-size: 18px;
    line-height: 27px;
  }

  a.tag-btn {
    font-size: 17px;
  }

  .hero p {
    font-size: 23px;
    line-height: 30px;
  }

  p.sml, .hero p.sml {
    font-size: 18px;
    line-height: 27px;
  }

  .subhero h5 {
    font-size: 23px;
    line-height: 30px;
  }

  ul.sectionmenu li {
    font-size: 17px;
    line-height: 25px;
  }

  .two-col-page.smlp p {
    font-size: 17px;
    line-height: 25px;
  }

  .three-col p {
    font-size: 17px;
    line-height: 25px;
  }

  .usecase > div p {
    font-size: 17px;
    line-height: 25px;
  }

  .usecase > div:nth-child(2) h2 {
    font-size: 45px;
    line-height: 55px;
  }

  main form input[type=email], main form input[type=text], main form textarea {
    font-size: 17px;
  }

  main form label {
    font-size: 17px;
  }

  main form input[type=submit] {
    font-size: 17px;
  }

  form input[type=email], form input[type=text], form textarea {
    font-size: 17px;
  }

  form label {
    font-size: 18px;
  }

  form input[type=submit] {
    font-size: 18px;
  }

  .blogroll a.btn, .newspage a.btn {
    font-size: 14px;
    line-height: 20px;
  }

  .blogroll > div h3 {
    font-size: 18px;
    line-height: 27px;
  }

  .blogroll > div p {
    font-size: 14px;
    line-height: 20px;
  }

  .blog .blogroll > div:nth-child(1) h3, .blog .blogroll > div:nth-child(2) h3, .archive .blogroll > div:nth-child(1) h3, .archive .blogroll > div:nth-child(2) h3 {
    font-size: 18px;
    line-height: 27px;
  }

  .blog .blogroll > div:nth-child(1) p, .blog .blogroll > div:nth-child(2) p, .blog .blogroll > div:nth-child(1) button.tagbtn, .blog .blogroll > div:nth-child(2) button.tagbtn, .archive .blogroll > div:nth-child(1) p, .archive .blogroll > div:nth-child(2) p, .archive .blogroll > div:nth-child(1) button.tagbtn, .archive .blogroll > div:nth-child(2) button.tagbtn {
    font-size: 14px;
    line-height: 20px;
  }

  .blog .blogroll > div:nth-child(1) a img, .blog .blogroll > div:nth-child(2) a img, .archive .blogroll > div:nth-child(1) a img, .archive .blogroll > div:nth-child(2) a img {
    height: 240px;
  }

  .accordion {
    font-size: 23px;
    line-height: 30px;
  }

  .box-col > div h4 {
    font-size: 23px;
    line-height: 30px;
  }

  .box-col > div a.button {
    font-size: 18px;
    line-height: 27px;
  }

  .box-col > div .overlay p {
    font-size: 17px;
    line-height: 25px;
  }

  .searchandfilter h4 {
    font-size: 19px;
    line-height: 28px;
  }

  .logos > img {
    height: 40px;
  }

  .hero-feature-boxes > div p {
    font-size: 17px;
    line-height: 25px;
  }

  .two-col-page > div.featurebox-three h3, .herobox-one h3 {
    font-size: 40px;
    line-height: 50px;
  }

  .hero.illuminate-for-scale .hero-content h2 {
    font-size: 50px;
    line-height: 55px;
  }

  main.illuminate-for-scale h2 {
    font-size: 45px;
    line-height: 55px;
  }

  main.illuminate-for-scale h2.sml {
    font-size: 40px;
    line-height: 50px;
  }
}
@media (max-width: 1080px) {
  ul.sectionmenu li {
    padding: 0 1em;
    line-height: 45px;
  }
}
@media (max-height: 900px) {
  .hero p.sml {
    font-size: 17px;
    line-height: 25px;
  }

  .herobox-one {
    min-height: unset;
  }
}
@media (max-width: 890px) {
  .three-col > div {
    flex: 0 0 50%;
  }

  .blogroll > div {
    flex: 0 0 calc(50% - 40px);
  }

  #sidebarMenu {
    width: 50vw;
    transform: translateX(50vw);
  }
}
@media (max-width: 800px) {
  .diagwrap {
    padding: 1em 2em;
  }

  .usecase > div:nth-child(2) {
    padding-top: 20px;
  }

  .usecase > div {
    flex: 0 0 100%;
    padding: 20px;
  }

  .usecase .usecaselogo {
    height: 30px;
  }
}
@media (max-width: 720px) {
  .hero-content {
    padding: 0 20px;
  }

  .subhero {
    padding: 1em 20px;
  }

  .hero.sub .hero-content {
    padding: 2em 5em 2em 20px;
  }

  header.navigation {
    padding: 20px 20px;
  }

  .sidebarIconToggle {
    right: 20px;
  }

  .slimwrap {
    padding: 0 20px;
  }

  .slimwrap.newspage {
    padding: 2em 20px;
    margin-top: -4em;
  }

  article, aside {
    flex: 0 0 100%;
    padding: 1em 20px;
  }

  .two-col > div {
    padding: 3em 20px;
  }

  .box-col > div {
    flex: 0 0 calc(100% - 34px);
    padding: 20px;
  }

  .overlay {
    padding: 20px;
  }

  footer {
    padding: 2em 20px 2em;
  }

  footer .two-col > div:nth-child(1) .two-col > div {
    flex: 0 0 100%;
  }

  .socials > a > img {
    width: 36px;
    height: 36px;
  }

  .accordion:before {
    width: 20px;
    height: 20px;
  }

  .aactive:before {
    width: 20px;
    height: 20px;
  }

  .single .subhero {
    height: 35vh;
  }

  .single .herosvgwrap img {
    height: 35vh;
  }

  .hero-feature-boxes {
    margin: 0 -1em;
  }

  .hero-feature-boxes > div {
    flex: 0 0 calc(100% - 2em);
    padding: 1em;
  }

  a.pointer svg {
    width: 16px;
    height: 18px;
  }

  .hero.illuminate-for-scale .hero-content {
    padding: 0 20px 40px;
  }

  .hero.illuminate-for-scale .wp-block-button__link {
    right: 20px;
  }
}
@media (max-width: 680px) {
  select {
    font-size: 12px;
  }

  .two-col > div {
    flex: 0 0 100%;
  }

  .two-col-page > div {
    flex: 0 0 100%;
  }

  .logos > img {
    height: 30px;
  }

  .two-col-page > div.featurebox-one, .two-col-page > div.featurebox-two {
    flex: 0 0 calc(100% - 40px);
    margin: 0 20px 3em;
  }

  .page-id-1695 main .heroimgtxt h2 {
    font-size: 150px;
  }

  .heroimgtxt {
    margin-top: -250px;
  }

  .two-col-vs > div {
    flex: 0 0 100%;
  }

  .two-col-vs > div:nth-child(2) {
    flex: 0 0 100%;
    padding: 0 30px;
  }

  .vs {
    margin: 0 auto;
    display: block;
    width: 105px;
    height: auto;
  }
}
/* Hanzo Text Size - Mobile  */
@media (max-width: 600px) {
  h1 {
    font-size: 50px;
    line-height: 55px;
  }

  h2, .single h1, h1.wp-block-heading {
    font-size: 28px;
    line-height: 35px;
  }

  h3 {
    font-size: 21px;
    line-height: 29px;
  }

  h4 {
    font-size: 21px;
    line-height: 29px;
  }

  h5, p.subhead {
    font-size: 17px;
    line-height: 25px;
  }

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

  ul li, ol li {
    font-size: 19px;
    line-height: 26px;
  }

  .sidebarMenuInner li a {
    font-size: 21px;
    line-height: 29px;
  }

  a.btn {
    font-size: 17px;
    line-height: 25px;
  }

  p.pgbtn a {
    font-size: 17px;
    line-height: 25px;
  }

  .wp-block-button__link {
    font-size: 17px;
    line-height: 25px;
  }

  a.tag-btn {
    font-size: 16px;
  }

  .hero p {
    font-size: 21px;
    line-height: 29px;
  }

  p.sml, .hero p.sml {
    font-size: 17px;
    line-height: 25px;
  }

  .subhero h5 {
    font-size: 21px;
    line-height: 29px;
  }

  ul.sectionmenu li {
    font-size: 16px;
    line-height: 22px;
  }

  .two-col-page.smlp p {
    font-size: 16px;
    line-height: 22px;
  }

  .three-col p {
    font-size: 16px;
    line-height: 22px;
  }

  .usecase > div p {
    font-size: 16px;
    line-height: 22px;
  }

  .usecase > div:nth-child(2) h2 {
    font-size: 35px;
    line-height: 42px;
  }

  main form input[type=email], main form input[type=text], main form textarea {
    font-size: 16px;
  }

  main form label {
    font-size: 16px;
  }

  main form input[type=submit] {
    font-size: 16px;
  }

  form input[type=email], form input[type=text], form textarea {
    font-size: 16px;
  }

  form label {
    font-size: 17px;
  }

  form input[type=submit] {
    font-size: 17px;
  }

  .three-col > div {
    flex: 0 0 100%;
  }

  .blogroll > div {
    flex: 0 0 calc(100% - 40px);
  }

  .blog .blogroll > div:nth-child(1), .blog .blogroll > div:nth-child(2), .archive .blogroll > div:nth-child(1), .archive .blogroll > div:nth-child(2) {
    flex: 0 0 calc(100% - 40px);
  }

  .searchandfilter ul li {
    flex: 0 0 100%;
  }

  .searchandfilter h4 {
    padding-top: 1em;
  }

  .blogroll a.btn, .newspage a.btn {
    font-size: 14px;
    line-height: 20px;
  }

  .blogroll > div h3 {
    font-size: 17px;
    line-height: 25px;
  }

  .blogroll > div p {
    font-size: 14px;
    line-height: 20px;
  }

  .blog .blogroll > div:nth-child(1) h3, .blog .blogroll > div:nth-child(2) h3, .archive .blogroll > div:nth-child(1) h3, .archive .blogroll > div:nth-child(2) h3 {
    font-size: 17px;
    line-height: 25px;
  }

  .blog .blogroll > div:nth-child(1) p, .blog .blogroll > div:nth-child(2) p, .blog .blogroll > div:nth-child(1) button.tagbtn, .blog .blogroll > div:nth-child(2) button.tagbtn, .archive .blogroll > div:nth-child(1) p, .archive .blogroll > div:nth-child(2) p, .archive .blogroll > div:nth-child(1) button.tagbtn, .archive .blogroll > div:nth-child(2) button.tagbtn {
    font-size: 14px;
    line-height: 20px;
  }

  .accordion {
    font-size: 21px;
    line-height: 29px;
  }

  .box-col > div h4 {
    font-size: 21px;
    line-height: 29px;
  }

  .box-col > div a.button {
    font-size: 17px;
    line-height: 25px;
  }

  .box-col > div .overlay p {
    font-size: 16px;
    line-height: 22px;
  }

  .searchandfilter h4 {
    font-size: 19px;
    line-height: 26px;
  }

  .hero-feature-boxes > div p {
    font-size: 16px;
    line-height: 22px;
  }

  .two-col-page > div.featurebox-three h3, .herobox-one h3 {
    font-size: 28px;
    line-height: 35px;
  }

  .hero.illuminate-for-scale .hero-content h1 {
    font-size: 28px;
    line-height: 35px;
  }

  .hero.illuminate-for-scale .hero-content h2 {
    font-size: 28px;
    line-height: 35px;
  }

  main.illuminate-for-scale h2 {
    font-size: 28px;
    line-height: 35px;
  }

  main.illuminate-for-scale h2.sml {
    font-size: 28px;
    line-height: 35px;
  }
}
@media (max-width: 480px) {
  .usecase {
    margin: 2em 18px;
  }

  .prevnext {
    width: 12px;
    height: 19px;
    left: 0;
  }

  .next {
    right: 0;
    left: unset;
  }

  .herobox-one {
    padding: 0 0 0 0;
    background-image: none !important;
    margin-bottom: 0;
  }
}
@media (max-width: 420px) {
  #sidebarMenu {
    width: 100vw;
    transform: translateX(100vw);
  }

  h1 {
    font-size: 35px;
    line-height: 45px;
  }

  .subhero {
    height: 70vh;
  }

  .herosvgwrap img {
    height: 70vh;
  }

  .svgar {
    display: none;
  }

  .hdlogo img, .mftlogo img {
    width: 180px;
    height: 61px;
  }

  .hero.sub .hero-content {
    padding: 2em 32px 1em 20px;
  }

  .hero h1 {
    font-size: 28px;
    line-height: 35px;
  }

  .hero p {
    font-size: 16px;
    line-height: 22px;
  }
}
.single-use-cases .newspage h1 {
    padding: 0.5em 0 0;
}
.three-col a {
    font-size: 18px;
    line-height: 28px;
}
.three-col a.readmore {
    background-size: 35px 13.5px;
}
/*# sourceMappingURL=style.css.map */