* {
  box-sizing: border-box;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

html {
  overflow-x: hidden;
  width: 100%;
}

body {
  font-family: "Roboto", sans-serif;
  color: #4b4b4b;
  overflow-x: hidden;
  width: 100%;
  grid-template-columns: 20px auto minmax(100px, 400px) minmax(100px, 400px) minmax(100px, 400px) auto 20px;
  grid-template-rows: auto auto auto auto auto auto;
  grid-template-areas: "header header header header header header header " "wistia wistia wistia wistia wistia wistia wistia" "words words words words words words words" "recdec recdec recdec recdec recdec recdec recdec" "team team team team team team team" "clients clients clients clients clients clients clients" "contact contact contact contact contact contact contact";
  /**
  font sizes
   */
  font-size: 16px;
  /* p{
     grid-area: para;
   }*/
}
body h5, body label {
  font-size: 18px;
  text-transform: uppercase;
}
body h2 {
  font-size: 22px;
  line-height: 18px;
  text-transform: uppercase;
}
body h1 {
  font-size: 35px;
  line-height: 28px;
  text-transform: uppercase;
}
@media (min-width: 768px) {
  body {
    font-size: 20px;
  }
  body h5, body label {
    font-size: 22px;
  }
  body h2 {
    font-size: 33px;
    line-height: 27px;
  }
  body h1 {
    font-size: 50px;
    line-height: 37px;
  }
}
@media (min-width: 992px) {
  body {
    font-size: 22px;
  }
  body h5, body label {
    font-size: 24px;
  }
  body h2 {
    font-size: 40px;
    line-height: 30px;
  }
  body h1 {
    font-size: 66px;
    line-height: 47px;
  }
}
body header, body .header-clone {
  display: flex;
}
body .mobile-fixed {
  position: fixed;
  width: 100%;
  top: 0;
  left: 0;
  height: 60px;
  background: white;
  z-index: 1000000;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
@media (min-width: 768px) {
  body .mobile-fixed {
    opacity: 0;
    pointer-events: none;
  }
}
body .mobile-fixed .logo-wrap {
  padding-left: 12px;
  display: flex;
  align-items: flex-end;
}
body .mobile-fixed .logo-wrap img {
  width: 120px;
  height: 50px;
  object-fit: contain;
}
body .mobile-fixed .burger-contain {
  padding: 12px;
}
body header {
  grid-area: header;
  position: fixed;
  display: grid;
  width: 100%;
  grid-template-columns: 20px auto minmax(100px, 400px) minmax(100px, 400px) minmax(100px, 400px) auto 20px;
  background: white;
  z-index: 10000;
  transform: translate3d(0, calc(-100% + 60px), 0);
  transition: 0.2s transform 0s ease-in;
  will-change: transform;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);
  transition: all 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  padding: 0 5vw;
}
body header .inner {
  grid-column: 3/span 3;
  display: flex;
  justify-content: center;
}
body header .inner .logo-wrap {
  display: none;
  align-items: flex-end;
  margin-right: 5vw;
}
body header .inner .logo-wrap img {
  width: 120px;
  height: 50px;
  object-fit: contain;
}
@media (min-width: 768px) {
  body header .inner .logo-wrap img {
    width: 250px;
    height: 120px;
  }
}
body header .inner ul {
  list-style: none;
  display: flex;
  flex-direction: column;
  margin: 6px 0 6px 0;
  width: 83px;
  align-items: center;
  padding: 56px 0 0 0;
  opacity: 0;
  transition: 0.1s opacity 0s linear;
  will-change: opacity;
  align-self: flex-end;
}
body header .inner ul a, body header .inner ul a:visited {
  width: 100%;
  text-transform: uppercase;
  text-decoration: none;
  color: #4b4b4b;
  font-weight: 900;
  line-height: 22px;
  text-align: center;
}
body header .deep-contain {
  display: none;
  margin-left: auto;
  align-items: flex-end;
  padding-bottom: 10px;
}
body header .deep-contain img {
  width: 120px;
  height: 120px;
  margin-right: 5px;
}
body header .deep-contain p {
  max-width: 100px;
  font-weight: 400;
  margin: 0;
  font-size: 16px;
}
body header.open {
  transform: translate3d(0, 0, 0);
}
body header.open .inner ul {
  opacity: 1;
  transition: 0.3s opacity 0.2s linear;
}
@media (min-width: 768px) {
  body header {
    transform: translate3d(0, 0, 0);
    transition: 0.2s transform 0s ease-in;
  }
  body header .inner {
    justify-content: space-between;
  }
  body header .inner ul {
    flex-grow: 1;
    opacity: 1;
    transition: 0.3s opacity 0.2s linear;
    align-items: flex-start;
    padding: 0;
    margin-bottom: 21px;
    margin-top: 50px;
  }
  body header .inner ul li a {
    text-align: left;
  }
  body header .inner .logo-wrap {
    display: flex;
  }
  body header .inner .deep-contain {
    display: flex;
    padding-bottom: 91px;
  }
}
body div.wistia_responsive_padding {
  grid-area: wistia;
}
body div.vimeo_main {
  padding-top: 60px;
  grid-area: wistia;
  height: 46.875vw;
  background-color: black;
  box-sizing: content-box;
}
body div.vimeo_main iframe {
  width: 100%;
  height: 100%;
}
@media (min-width: 768px) {
  body div.vimeo_main {
    padding-top: 200px;
  }
}
body div.words-testimonials {
  grid-area: words;
  margin: auto;
  width: 100%;
  max-width: 1200px;
  background: white;
  display: flex;
  flex-wrap: wrap;
  padding: 0 20px 30px 20px;
  padding-bottom: 30px;
  overflow-x: hidden;
  justify-content: space-between;
}
body div.words-testimonials p {
  margin: 0;
}
@media (max-width: 768px) {
  body div.words-testimonials {
    justify-content: center;
  }
}
body div.words-testimonials > div {
  width: 50%;
  display: flex;
  justify-content: center;
  max-width: 600px;
}
body div.words-testimonials > div:nth-of-type(1) {
  padding-right: 20px;
}
@media (max-width: 768px) {
  body div.words-testimonials > div {
    width: 100%;
    max-width: 500px;
  }
}
body div.words-testimonials h1 {
  text-transform: uppercase;
}
body div.words-testimonials .testimonials {
  display: flex;
  flex-direction: column;
}
body div.words-testimonials .testimonials .swiper-testimonials-container-outside {
  flex-grow: 1;
  display: flex;
  overflow: hidden;
}
@media (max-width: 768px) {
  body div.words-testimonials .testimonials .swiper-testimonials-container-outside {
    overflow: visible;
  }
}
body div.words-testimonials .testimonials .swiper-testimonials-container-outside .swiper-wrapper {
  flex-grow: 1;
  height: auto;
}
body div.words-testimonials .testimonials .item {
  height: auto;
  min-height: 100%;
  align-self: stretch;
  width: 100%;
}
body div.words-testimonials .testimonials .orange-radius-blob {
  height: 100%;
  position: relative;
  width: calc(100% - 100px);
  background-color: #ff9d00;
  border-radius: 20px;
  padding: 20px 30px 20px 20px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  flex-grow: 1;
  cursor: pointer;
}
body div.words-testimonials .testimonials .orange-radius-blob p {
  color: white;
  text-transform: uppercase;
  font-weight: 900;
  font-size: inherit;
}
body div.words-testimonials .testimonials .orange-radius-blob h5 {
  text-transform: uppercase;
  font-weight: 900;
  margin: 0;
}
body div.words-testimonials .testimonials img {
  position: absolute;
  right: -100px;
  top: 55%;
  transform: translateY(-50%);
  width: 120px;
  height: 120px;
}
body div.recent-decent {
  position: relative;
  overflow: hidden;
  grid-area: recdec;
  display: grid;
  grid-template-columns: 20px auto minmax(100px, 400px) minmax(100px, 400px) minmax(100px, 400px) auto 20px;
  padding-bottom: 50px;
}
body div.recent-decent .inner {
  grid-column: 3/span 3;
  padding: 20px 0;
}
body div.recent-decent .inner .titles {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
}
body div.recent-decent .inner .titles h1, body div.recent-decent .inner .titles h2 {
  margin: 0;
}
body div.recent-decent .inner .titles h2 {
  margin: 0;
  background: grey;
  color: #ffc600;
  padding: 5px;
}
body div.recent-decent .inner .titles h1 {
  text-align: right;
  color: white;
  padding-bottom: 40px;
}
body div.recent-decent .inner .video-thumbs-contain {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  width: calc(100% + 10px);
  transform: translateX(-5px);
  justify-content: center;
}
@media (min-width: 992px) {
  body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(odd) h5, body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(odd) p {
    color: #ff9d00;
  }
}
@media (max-width: 768px) {
  body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(odd) h5, body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(odd) p {
    color: #ff9d00;
  }
}
@media (max-width: 992px) and (min-width: 768px) {
  body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(4n+1) h5, body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(4n+1) p {
    color: #ff9d00;
  }
  body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(4n+4) h5, body div.recent-decent .inner .video-thumbs-contain > div:nth-of-type(4n+4) p {
    color: #ff9d00;
  }
}
body div.recent-decent .inner .video-thumbs-contain .video-blob {
  width: 100%;
  margin: 5px;
  padding: 5px;
  background-color: white;
}
@media (min-width: 768px) {
  body div.recent-decent .inner .video-thumbs-contain .video-blob {
    width: calc(50% - 10px);
  }
}
@media (min-width: 992px) {
  body div.recent-decent .inner .video-thumbs-contain .video-blob {
    width: calc(33% - 20px);
  }
}
body div.recent-decent .inner .video-thumbs-contain .video-blob .iframe-wrap1 {
  position: relative;
  height: 0;
  padding: 0 0 56.25% 0;
}
body div.recent-decent .inner .video-thumbs-contain .video-blob .iframe-wrap1 .iframe-wrap2 {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
body div.recent-decent .inner .video-thumbs-contain .video-blob .iframe-wrap1 .iframe-wrap2 iframe {
  width: 100%;
  height: 100%;
}
body div.recent-decent .inner .video-thumbs-contain .video-blob img {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: 100px;
  height: 110px;
  z-index: 10;
  will-change: opacity;
  pointer-events: none;
}
body div.recent-decent .inner .video-thumbs-contain .video-blob .info {
  padding: 10px 10px 0 10px;
}
body div.recent-decent .inner .video-thumbs-contain .video-blob h5, body div.recent-decent .inner .video-thumbs-contain .video-blob p {
  margin: 0;
  font-size: 16px;
}
body div.recent-decent .inner .video-thumbs-contain .video-blob h5 {
  font-size: 18px !important;
}
body div.recent-decent .inner .video-thumbs-contain .video-blob p {
  font-size: 16px !important;
}
body div.recent-decent .plax-pin {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: -1;
  height: 200%;
}
body div.recent-decent .striped-bg {
  position: absolute;
  width: 300%;
  height: 200%;
  top: 0;
  left: -50%;
  background: repeating-linear-gradient(-30deg, white, white 2px, black 2px, black 30px);
  z-index: -1;
  will-change: transform;
}
body .team {
  position: relative;
  grid-area: team;
  background: #c2c2c2;
  background: -moz-linear-gradient(left, #c2c2c2 0%, #d6d6d6 23%, #e8e8e8 50%, #d6d6d6 74%, #bdbdbd 100%);
  background: -webkit-gradient(left top, right top, color-stop(0%, #c2c2c2), color-stop(23%, #d6d6d6), color-stop(50%, #e8e8e8), color-stop(74%, #d6d6d6), color-stop(100%, #bdbdbd));
  background: -webkit-linear-gradient(left, #c2c2c2 0%, #d6d6d6 23%, #e8e8e8 50%, #d6d6d6 74%, #bdbdbd 100%);
  background: -o-linear-gradient(left, #c2c2c2 0%, #d6d6d6 23%, #e8e8e8 50%, #d6d6d6 74%, #bdbdbd 100%);
  background: -ms-linear-gradient(left, #c2c2c2 0%, #d6d6d6 23%, #e8e8e8 50%, #d6d6d6 74%, #bdbdbd 100%);
  background: linear-gradient(to right, #c2c2c2 0%, #d6d6d6 23%, #e8e8e8 50%, #d6d6d6 74%, #bdbdbd 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#c2c2c2", endColorstr="#bdbdbd", GradientType=1 );
  overflow: hidden;
}
body .team .plax-pin {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
}
body .team .mug-bg {
  margin-top: 100px;
  background: url("/assets/img/mug_height_plain.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  opacity: 0.3;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  grid-row: 1;
  z-index: 1;
}
body .team .inner {
  position: relative;
  z-index: 2;
  padding: 50px 10px 50px 10px;
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
}
body .team .inner .swiper-team-outside-wrapper {
  order: 2;
  width: 300px;
  max-width: 300px;
}
body .team .inner img.face {
  border: solid white 3px;
  border-radius: 50%;
  width: 133px;
  height: 133px;
}
body .team .inner .flipper img {
  position: relative;
  left: 50%;
  transform: translate(-50%, 0);
  margin-bottom: 3px;
  cursor: pointer;
}
body .team .inner .flipper .card {
  padding: 30px;
  position: relative;
  cursor: pointer;
  background: white;
  border-radius: 2px;
}
body .team .inner .flipper .card h2 {
  font-size: 21px !important;
  line-height: 15px;
}
body .team .inner .flipper .card p {
  padding-top: 20px;
  font-size: 16px !important;
}
body .team .inner .flipper .card h2, body .team .inner .flipper .card h5, body .team .inner .flipper .card p {
  margin: 0;
}
body .team .inner .flipper .card h5 {
  padding-top: 5px;
  color: #ff9d00;
  font-size: 18px !important;
  line-height: 18px;
}
body .team .inner .flipper .card:before {
  content: "";
  background-image: url("/assets/img/left_hand.png");
  position: absolute;
  top: 50%;
  transform: translate(-55%, -50%);
  left: 0;
  width: 50px;
  height: 70px;
  object-fit: contain;
  background-size: 50px 70px;
}
body .team .inner .flipper .card:after {
  content: "";
  background-image: url("/assets/img/right_hand.png");
  position: absolute;
  top: 50%;
  transform: translate(62%, -50%);
  right: 0;
  width: 50px;
  height: 70px;
  object-fit: contain;
  background-size: 50px 70px;
}
body .team .inner .all-faces {
  order: 1;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  position: relative;
  width: 100%;
  top: -13px;
}
body .team .inner .all-faces > div:nth-child(1) {
  top: 100px;
}
body .team .inner .all-faces > div:nth-child(2) {
  top: 29px;
  left: -19px;
}
body .team .inner .all-faces > div:nth-child(4) {
  top: 29px;
  left: 19px;
}
body .team .inner .all-faces > div:nth-child(5) {
  top: 100px;
}
body .team .inner .all-faces .photo-name-blob {
  width: 20%;
  max-width: 70px;
  margin-bottom: 10px;
  display: flex;
  justify-content: flex-end;
  position: relative;
}
body .team .inner .all-faces .photo-name .img-wrap {
  position: relative;
  width: 70px;
  height: 70px;
}
body .team .inner .all-faces .photo-name .img-wrap:after {
  opacity: 0;
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  border-radius: 50%;
  webkit-box-shadow: 0px 0px 12px 3px #45a8d6;
  -moz-box-shadow: 0px 0px 12px 3px #45a8d6;
  box-shadow: 0px 0px 12px 3px #45a8d6;
  transition: 0.2s opacity 0s linear;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
body .team .inner .all-faces .photo-name .img-wrap.active:after {
  opacity: 1;
}
body .team .inner .all-faces .photo-name img.face {
  border: solid white 2px;
  border-radius: 50%;
  width: 70px;
  height: 70px;
  cursor: pointer;
}
body .team .inner .all-faces .photo-name h5 {
  display: none;
  margin: 3px;
  font-size: 19px;
  background: white;
  text-align: center;
  line-height: 20px;
  padding: 8px;
  width: 120px;
}
@media (min-width: 768px) {
  body .team .inner {
    justify-content: space-evenly;
  }
  body .team .inner .swiper-team-outside-wrapper {
    order: 1;
  }
  body .team .inner .all-faces {
    width: 300px;
    top: 0;
    order: 2;
    flex-direction: column;
    align-items: center;
  }
  body .team .inner .all-faces > div.photo-name-blob {
    top: 0;
    left: 0;
    max-width: none;
    width: auto;
  }
  body .team .inner .all-faces .photo-name {
    display: flex;
    align-items: center;
  }
  body .team .inner .all-faces .photo-name .img-wrap {
    position: relative;
    width: 90px;
    height: 90px;
  }
  body .team .inner .all-faces .photo-name .img-wrap img.face {
    width: 90px;
    height: 90px;
  }
  body .team .inner .all-faces .photo-name h5 {
    display: block;
    margin-left: 20px;
  }
}
@media (min-width: 1200px) {
  body .team .inner {
    justify-content: center;
  }
  body .team .inner .swiper-team-outside-wrapper {
    order: 1;
  }
  body .team .inner .all-faces {
    width: 700px;
    margin-left: 20px;
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-evenly;
  }
  body .team .inner .all-faces > div.photo-name-blob {
    top: 0;
    left: 0;
    max-width: none;
    width: auto;
    margin: 5px;
  }
  body .team .inner .all-faces .photo-name {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  body .team .inner .all-faces .photo-name .img-wrap {
    position: relative;
    width: 130px;
    height: 130px;
  }
  body .team .inner .all-faces .photo-name .img-wrap img.face {
    width: 130px;
    height: 130px;
  }
  body .team .inner .all-faces .photo-name h5 {
    display: block;
    margin: 0;
  }
}
body .clients {
  grid-area: clients;
  display: flex;
  justify-content: center;
  overflow: hidden;
}
body .clients .container {
  max-width: 1200px;
  overflow: hidden;
}
body .clients .panning-images {
  background-image: url("/assets/img/clients_all.png");
  background-repeat: repeat-x;
  background-size: contain;
  height: 330px;
  width: 5000px;
  animation: slide 70s linear infinite;
  position: relative;
  left: -3038px;
}
body .clients h2, body .clients h5 {
  padding: 20px;
  width: 100%;
  max-width: 1200px;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
body .clients h2 {
  grid-area: title;
  padding: 20px;
  color: #ff9d00;
}
body .clients h5 {
  grid-area: t2;
  text-align: right;
  color: #ff9d00;
  padding: 20px;
  text-transform: uppercase;
}
@keyframes slide {
  0% {
    transform: translate3d(0, 0, 0);
  }
  100% {
    transform: translate3d(3038px, 0, 0);
  }
}
body .contact {
  grid-area: contact;
  background: #7c7c7c;
  padding: 60px 8vw;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  flex-direction: column;
}
body .contact h2 {
  font-size: 30px;
  margin: 20px 0;
  color: #373737;
}
body .contact h5 {
  margin: 0;
  color: white;
  line-height: 22px;
  font-size: 16px;
}
body .contact .contact-info {
  width: 100%;
  max-width: 300px;
}
body .contact .enquiry {
  width: 100%;
  max-width: 500px;
}
body .contact .enquiry label, body .contact .enquiry h5 {
  width: 100px;
  flex-shrink: 0;
}
body .contact .enquiry .i-textarea, body .contact .enquiry .i-text {
  display: flex;
  align-items: center;
  margin: 5px 0;
}
body .contact .enquiry textarea, body .contact .enquiry input {
  width: 200px;
  flex-grow: 1;
  border-radius: 6px;
  -webkit-appearance: none;
  outline: none;
  padding: 5px;
  border-top: transparent !important;
  border-left: transparent !important;
  border-right: transparent !important;
  border-bottom: transparent !important;
}
body .contact .enquiry textarea:focus, body .contact .enquiry input:focus {
  outline: none;
}
body .contact .enquiry input {
  margin-right: 40px;
}
body .contact .enquiry textarea {
  resize: none;
}
body .contact .enquiry button {
  margin-left: 100px;
  background: none;
  border: 2px solid white;
  border-radius: 6px;
  padding: 5px 10px;
  cursor: pointer;
  color: white;
  margin-top: 10px;
}
body .contact .enquiry button:focus {
  outline: none;
}
body .contact .copyright {
  width: 100%;
  margin-top: 80px;
  text-align: center;
  font-size: 14px;
}
@media (min-width: 576px) {
  body .contact {
    padding: 60px 17vw;
  }
}
@media (min-width: 768px) {
  body .contact {
    padding: 60px 23vw;
  }
}
@media (min-width: 992px) {
  body .contact {
    flex-direction: row;
    justify-content: center;
    padding: 60px 0;
  }
}

/*.burger-contain{
  z-index: 1000000;
  position:fixed;
  top:0px;
  right:0px;
  padding: 10px;
}*/
.burger {
  height: 3em;
  width: 3em;
  position: relative;
  font-size: 12px;
  cursor: pointer;
  -webkit-transition: 0.2s all;
  -o-transition: 0.2s all;
  transition: 0.2s all;
  -webkit-tap-highlight-color: transparent;
}

.burger .burger-lines:after {
  left: 0;
  top: -1em;
}

.burger .burger-lines:before {
  left: 1em;
  top: 1em;
}

.burger:after {
  content: "";
  display: block;
  position: absolute;
  height: 150%;
  width: 150%;
  top: -25%;
  left: -25%;
}

.burger .burger-lines {
  top: 50%;
  margin-top: -0.125em;
}

.burger .burger-lines, .burger .burger-lines:after, .burger .burger-lines:before {
  pointer-events: none;
  display: block;
  content: "";
  width: 100%;
  border-radius: 0.25em;
  background-color: black;
  height: 0.25em;
  position: absolute;
  -webkit-transform: rotate(0);
  -ms-transform: rotate(0);
  transform: rotate(0);
}

.burger .burger-lines:after {
  left: 0;
  top: -1em;
}

.burger .burger-lines:before {
  left: 1em;
  top: 1em;
}

.burger.burger-squeeze .burger-lines, .burger.burger-squeeze .burger-lines:after, .burger.burger-squeeze .burger-lines:before {
  -webkit-transition: 0.2s top 0.2s, 0.1s left, 0.2s transform, 0.4s background-color 0.2s;
  -o-transition: 0.2s top 0.2s, 0.1s left, 0.2s transform, 0.4s background-color 0.2s;
  transition: 0.2s top 0.2s, 0.1s left, 0.2s transform, 0.4s background-color 0.2s;
}

.burger.burger-squeeze .burger-lines:after, .burger.burger-squeeze .burger-lines:before {
  width: 2em;
}

.burger.burger-squeeze.open .burger-lines, .burger.burger-squeeze.open .burger-lines:after, .burger.burger-squeeze.open .burger-lines:before {
  -webkit-transition: 0.2s background-color, 0.2s top, 0.2s left, 0.2s transform 0.15s;
  -o-transition: 0.2s background-color, 0.2s top, 0.2s left, 0.2s transform 0.15s;
  transition: 0.2s background-color, 0.2s top, 0.2s left, 0.2s transform 0.15s;
}

.burger.burger-squeeze.open .burger-lines {
  background-color: transparent;
}

.burger.burger-squeeze.open .burger-lines:before, .burger.burger-squeeze.open .burger-lines:after {
  left: 0.5em;
  top: 0px;
}

.burger.burger-squeeze.open .burger-lines:before {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.burger.burger-squeeze.open .burger-lines:after {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

header.open .burger .burger-lines, header.open .burger .burger-lines:after, header.open .burger .burger-lines:before {
  -webkit-transition: 0.2s background-color, 0.2s top, 0.2s left, 0.2s transform 0.15s;
  -o-transition: 0.2s background-color, 0.2s top, 0.2s left, 0.2s transform 0.15s;
  transition: 0.2s background-color, 0.2s top, 0.2s left, 0.2s transform 0.15s;
}

header.open .burger .burger-lines {
  background-color: transparent;
}

header.open .burger .burger-lines:before, header.open .burger .burger-lines:after {
  left: 0.5em;
  top: 0px;
}

header.open .burger .burger-lines:before {
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

header.open .burger .burger-lines:after {
  -webkit-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  transform: rotate(45deg);
}

/*# sourceMappingURL=style.css.map */