.aktiv {
  font-family: 'aktiv-grotesk-extended', sans-serif;
}
.bookmania {
  font-family: bookmania, sans-serif;
  font-weight: 400;
  font-style: normal;
}
/* colours */
/* vendor prefixes */
/* loading */
@keyframes expandWidth {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@-webkit-keyframes expandWidth {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@-moz-keyframes expandWidth {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
.body-loading {
  position: fixed;
  z-index: 999999999;
  top: 0;
  left: 0;
  height: 3px;
  background-color: #000000;
  display: none;
}
body.loading .body-loading {
  display: block;
  -webkit-animation: expandWidth 2s linear 1;
  -khtml-animation: expandWidth 2s linear 1;
  -moz-animation: expandWidth 2s linear 1;
  animation: expandWidth 2s linear 1;
}
/* layout */
.pad-tb {
  padding-top: 24px;
  padding-bottom: 24px;
}
.pad-tb-lg {
  padding-top: 48px;
  padding-bottom: 48px;
}
.constrain {
  position: relative;
}
.center-xy {
  position: absolute;
  left: 50%;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  -khtml-transform: translate(-50%, -50%);
  -moz-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}
.center-x {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -khtml-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  transform: translateX(-50%);
}
.center-y {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -khtml-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  transform: translateY(-50%);
}
.fill {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.height100 {
  position: relative;
  min-height: -moz-fill-available;
  min-height: fill-available;
  min-height: 100vh;
}
/* Avoid Chrome to see Safari hack */
@supports (-webkit-touch-callout: none) {
  .height100 {
    /* The hack for Safari */
    min-height: -webkit-fill-available;
  }
}
.height80 {
  position: relative;
  min-height: 80vh;
}
.height50 {
  position: relative;
  min-height: 50vh;
}
.fullwidth {
  width: 100%;
}
.fullscreen {
  position: relative;
  min-height: -moz-fill-available;
  min-height: fill-available;
  min-height: 100vh;
  width: 100%;
}
.centerVert {
  display: flex;
  flex-flow: column;
  justify-content: center;
}
/* Captions & aligment */
.aligncenter,
div.aligncenter {
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.alignleft {
  float: left;
  margin-right: 10px;
}
.alignright {
  float: right;
  margin-left: 10px;
}
.wp-caption {
  border: 1px solid #ddd;
  text-align: center;
  background-color: #f3f3f3;
  padding-top: 4px;
  margin: 10px;
  -moz-border-radius: 3px;
  -khtml-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.wp-caption img {
  margin: 0;
  padding: 0;
  border: 0 none;
}
.wp-caption p.wp-caption-text {
  font-size: 11px;
  line-height: 17px;
  padding: 0 4px 5px;
  margin: 0;
}
/* End captions & aligment */
html,
body,
html a {
  -webkit-font-smoothing: antialiased !important;
  text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.004);
}
ul,
li,
ol {
  list-style-type: none;
  margin: 0;
  padding: 0;
}
body {
  font-family: bookmania, sans-serif;
  font-weight: 400;
  font-style: normal;
  margin: 0;
  padding: 0;
  font-size: 18px;
  background-color: #ffffff;
}
a {
  color: #000000;
}
a:hover {
  color: #000000;
}
a:not(.btn),
a:not(.btn):active {
  border: 0;
  outline: 0;
}
img {
  border: 0;
  outline: 0;
  display: block;
  height: auto;
  max-width: 100%;
}
/* headings */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  margin: 0;
}
/* page layout */
#wrapper {
  margin: 0 auto;
}
.container-fluid {
  max-width: 1280px;
  margin: 0 auto;
}
/* hidden content */
.hiddenContentWrapper .hiddenContent {
  overflow-y: hidden;
}
.hiddenContentWrapper .hiddenContent div {
  margin-top: -100%;
  transition: all 0.2s ease-in-out;
}
.hiddenContentWrapper.open .hiddenContent div {
  margin-top: 0;
  transition: all 0.2s ease-in-out;
}
/* the content */
.the-content h1,
.the-content h2,
.the-content h3,
.the-content h4,
.the-content h5,
.the-content h6 {
  font-family: bookmania, sans-serif;
  font-weight: 400;
  font-style: normal;
  margin: 16px 0 24px 0;
}
.the-content h1:first-child,
.the-content h2:first-child,
.the-content h3:first-child,
.the-content h4:first-child,
.the-content h5:first-child,
.the-content h6:first-child {
  margin-top: 0;
}
.the-content p,
.the-content ul {
  margin-bottom: 16px;
}
.the-content li {
  list-style-type: disc;
  margin: 0 0 4px 24px;
}
.the-content h1 {
  font-size: 180%;
}
.the-content h2 {
  font-size: 90px;
  margin-bottom: 0;
}
.the-content h3 {
  font-size: 160%;
}
.the-content h4 {
  font-size: 150%;
}
.the-content h5 {
  font-size: 140%;
}
.the-content h6 {
  font-size: 130%;
}
/* header */
#header {
  padding: 7px 23px;
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  justify-content: flex-end;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 999;
  background-color: transparent;
  transition: all 0.2s ease-in-out;
}
#header #header-logo {
  max-width: 65px;
  height: auto;
  display: block;
  position: absolute;
  top: 15px;
  left: 15px;
  filter: invert(0);
  transition: all 0.2s ease-in-out;
}
/* top menu */
#top-menu {
  align-self: flex-end;
}
#top-menu ul {
  display: flex;
  flex-flow: row nowrap;
  justify-content: flex-end;
}
@media (min-width: 1024px) {
  #top-menu ul li.menu-item-home {
    display: none;
  }
}
#top-menu ul a {
  font-family: bookmania, sans-serif;
  font-weight: 400;
  font-style: normal;
  display: block;
  padding: 0 24px;
  font-size: 25px;
  color: #000000;
  transition: all 0.2s ease-in-out;
}
#top-menu ul a:hover {
  text-decoration: none;
}
/* gallery */
video {
  position: relative;
  object-fit: cover;
  width: 100%;
  max-width: 100%;
}
/* video controls removed 

.videoWrapper {
	.constrain;
	.controls {
		display: none;
		position: absolute;
		bottom: 0;
		left: 0;
		right: 0;
		height: 50px;
		z-index: 99;
		background-color: rgba(255,255,255,0.3);
		@pad: 14px;
		@size: 28px;
		a {
			background-repeat: no-repeat;
			background-position: left center;
			background-size: contain;
			position: absolute;
			display: block;
			bottom: @pad;
		}
		.audioControl {
			right: @pad;
			width: @size;
			height: @size;
			background-image: url(https://www.mwa.london/wp-content/themes/mwa/img/icons/volume-2.svg);
			filter: invert(1);
		}
		.playPause {
			background-image: url(https://www.mwa.london/wp-content/themes/mwa/img/icons/play.svg);
			left: @pad;
			width: @size;
			height: @size;
			filter: invert(1);
		}
		.progress {
			position: absolute;
			height: 1px;
			left: @size*2;
			right: @size*2;
			bottom: 50%;
			.vendor(transform, translateY(-1px));
			background-color: darken(@white, 40%);
			.bar {
				background-color: darken(@white, 20%);
				height: 1px;
				.vendor(transition, all 0.2s);
			}
		}
	}
	.mainPlayPause {
		.center-xy;
		display: block;
		@size: 180px;
		height: @size;
		width: @size;
		border-radius: 50%;
		background-color: rgba(0,0,0,0.4);
		&:after {
			.center-y;
			left: 37%;
			content: '';
			border-color: transparent transparent transparent rgba(255,255,255,0.9);
			border-style: solid;
			border-width: 40px 60px;
		}
	}
	&.muted {
		.controls {
			.audioControl {
				background-image: url(https://www.mwa.london/wp-content/themes/mwa/img/icons/mute.svg);
			}
		}
	}
	&.playing {
		.controls {
			.playPause {
				background-image: url(https://www.mwa.london/wp-content/themes/mwa/img/icons/pause.svg);
			}
		}
	}
} */
.gallery .galleryItem {
  position: relative;
}
.gallery .caption {
  z-index: 10;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 15px;
  background-color: rgba(255, 255, 255, 0.8);
  opacity: 0;
  line-height: 150%;
  overflow: hidden;
  -webkit-transition: all 0.3s;
  -khtml-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
.gallery .caption:hover {
  opacity: 1;
  -webkit-transition: all 0.3s;
  -khtml-transition: all 0.3s;
  -moz-transition: all 0.3s;
  transition: all 0.3s;
}
@media (min-width: 923px) {
  .gallery {
    position: relative;
    margin: 78px auto 90px auto;
  }
  .gallery [class*="col-"] {
    position: relative;
  }
  .gallery img,
  .gallery video {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
  }
  .gallery .desktopSize-halfwidth .galleryItem {
    width: 50%;
  }
  .gallery .desktopPosition-bottomleft .galleryItem {
    position: absolute;
    bottom: 0;
    left: 0;
  }
  .gallery .desktopPosition-bottomright .galleryItem {
    position: absolute;
    bottom: 0;
    right: 0;
  }
  .gallery .desktopPosition-topleft .galleryItem {
    position: absolute;
    top: 0;
    left: 0;
  }
  .gallery .desktopPosition-topright .galleryItem {
    position: absolute;
    top: 0;
    right: 0;
  }
}
@media (max-width: 922px) {
  .gallery .mobileSize-halfwidth .galleryItem {
    width: 50%;
  }
  .gallery .mobilePosition-left .galleryItem {
    margin-left: 0;
  }
  .gallery .mobilePosition-right .galleryItem {
    margin-left: 50%;
  }
  .gallery .mobile-order-1 {
    order: 1;
  }
  .gallery .mobile-order-2 {
    order: 2;
  }
  .gallery .mobile-order-3 {
    order: 3;
  }
  .gallery .mobile-order-4 {
    order: 4;
  }
}
.the-content h1,
.the-content h2 {
  font-family: bookmania, sans-serif;
  font-weight: 400;
  font-style: normal;
  line-height: 100%;
  font-size: 90px;
  margin-bottom: 45px;
}
.the-content h1 {
  margin-bottom: 76px;
}
.the-content h2 {
  font-size: 71px;
}
/* more content arrow */
.scrollDown {
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -khtml-transform: translateX(-50%);
  -moz-transform: translateX(-50%);
  transform: translateX(-50%);
  bottom: 40px;
  z-index: 10;
}
.scrollDown a {
  margin-top: 24px;
  display: block;
  height: 52px;
  width: 52px;
  background-image: url(https://www.mwa.london/wp-content/themes/mwa/img/icons/down.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  opacity: 1;
}
@keyframes fadeInOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-o-keyframes fadeInOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-moz-keyframes fadeInOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@-webkit-keyframes fadeInOut {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.animate__pulse {
  -webkit-animation: fadeInOut 3s infinite;
  -moz-animation: fadeInOut 3s infinite;
  -o-animation: fadeInOut 3s infinite;
  animation: fadeInOut 3s infinite;
}
/* Intro Text */
#introText {
  position: relative;
}
#introText .container-fluid {
  max-width: none;
}
#introText .container-fluid .row {
  justify-content: center;
}
#introText .the-content img {
  margin-bottom: 24px;
}
/* Fullscreen video background */
.bg_video {
  width: 100%;
}
/* footer */
#footer {
  padding-bottom: 20px;
}
#footer .container-fluid {
  max-width: 696px;
}
#footer hr {
  max-width: 1600px;
  margin-left: auto;
  margin-right: auto;
}
#footer #mwaLogo .col img {
  display: block;
  margin: 32px auto;
  max-height: 140px;
  width: auto;
}
#footer .col-12 {
  margin-bottom: 32px;
}
#footer .spacer {
  display: inline-block;
  width: 16px;
}
#footer p:last-child {
  margin-bottom: 0;
}
#footer #socialLinks {
  text-align: center;
}
#footer #copyrightText {
  text-align: center;
}
#footer .wp-block-separator {
  border-bottom: none;
}
/* About */
.page-title-about .container-fluid,
.page-title-contact .container-fluid {
  max-width: 1600px;
}
.page-title-about #wrapper,
.page-title-contact #wrapper {
  padding-top: 51px;
}
.page-title-about .the-content,
.page-title-contact .the-content {
  max-width: none;
  margin: 0 auto;
  width: 100%;
}
.page-title-about .the-content > *:not(hr, img, .wp-block-image),
.page-title-contact .the-content > *:not(hr, img, .wp-block-image) {
  max-width: 696px;
  margin-left: auto;
  margin-right: auto;
}
.page-title-about .the-content h1,
.page-title-contact .the-content h1 {
  font-size: var(--wp--preset--font-size--xlarge);
  margin: 48px auto;
}
.page-title-about .the-content h2,
.page-title-contact .the-content h2 {
  font-size: var(--wp--preset--font-size--xlarge);
  margin: 48px auto;
}
.page-title-about .the-content h3,
.page-title-contact .the-content h3 {
  font-size: var(--wp--preset--font-size--regular);
  margin-bottom: 4px;
  margin-top: 0;
  font-weight: 700;
}
.page-title-about .the-content ul,
.page-title-contact .the-content ul {
  margin-bottom: 24px;
}
.page-title-about .the-content li,
.page-title-contact .the-content li {
  list-style-type: none;
  margin: 0;
}
.page-title-about .the-content p,
.page-title-contact .the-content p {
  margin-bottom: 24px;
}
.page-title-about .the-content .wp-block-columns,
.page-title-contact .the-content .wp-block-columns {
  margin-bottom: 0;
}
.page-title-about .wp-block-separator,
.page-title-contact .wp-block-separator {
  border-bottom: none;
}
/* multiFormatSlideshow */
body.nav-light #top-menu ul a,
body.page-title-showreel #top-menu ul a {
  color: #ffffff;
  transition: all 0.2s ease-in-out;
}
body.nav-light #header #header-logo,
body.page-title-showreel #header #header-logo {
  filter: invert(1);
  transition: all 0.2s ease-in-out;
}
#multiFormatSlideshow .slick-track,
#multiFormatSlideshow .slide {
  position: relative;
  min-height: -moz-fill-available;
  min-height: fill-available;
  min-height: 100vh;
}
#multiFormatSlideshow .slide {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  overflow: hidden;
}
#multiFormatSlideshow .slide video {
  position: absolute;
  bottom: 0;
  right: 0;
  min-width: 100%;
  min-height: 100%;
}
#multiFormatSlideshow .slide .caption {
  position: absolute;
  bottom: 30px;
  left: 0;
  right: 0;
  text-align: center;
  font-size: 1.6rem;
  padding-left: 10px;
  padding-right: 10px;
  color: #000000;
}
body.nav-light #multiFormatSlideshow .slide .caption {
  color: #ffffff;
}
#multiFormatSlideshow .slick-arrow {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 50%;
  z-index: 10;
  cursor: pointer;
}
#multiFormatSlideshow .slick-arrow.slick-prev {
  left: 0;
}
#multiFormatSlideshow .slick-arrow.slick-prev:hover {
  cursor: url(https://www.mwa.london/wp-content/themes/mwa/img/cursor-left-black.png), auto;
}
body.nav-light #multiFormatSlideshow .slick-arrow.slick-prev:hover {
  cursor: url(https://www.mwa.london/wp-content/themes/mwa/img/cursor-left-white.png), auto;
}
#multiFormatSlideshow .slick-arrow.slick-next {
  right: 0;
}
#multiFormatSlideshow .slick-arrow.slick-next:hover {
  cursor: url(https://www.mwa.london/wp-content/themes/mwa/img/cursor-right-black.png), auto;
}
body.nav-light #multiFormatSlideshow .slick-arrow.slick-next:hover {
  cursor: url(https://www.mwa.london/wp-content/themes/mwa/img/cursor-right-white.png), auto;
}
.single-project cite {
  font-style: normal !important;
  font-size: var(--wp--preset--font-size--medium);
}
.single-project .wp-block-image img {
  width: 100%;
}
.single-project .pageHeader {
  min-height: 100vh;
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-end;
  background-size: cover;
  background-position: center;
}
.single-project .pageHeader h1,
.single-project .pageHeader h2 {
  font-family: 'aktiv-grotesk-extended', sans-serif;
  font-size: var(--wp--preset--font-size--xxlarge);
  line-height: 150%;
}
.single-project .projectMeta {
  color: white;
  padding: 0 0 40px 90px;
}
.single-project .projectMeta .showProjectInfo {
  display: block;
  margin-top: 40px;
  font-size: var(--wp--preset--font-size--large);
  color: white;
}
.single-project .projectMeta .showProjectInfo:hover {
  text-decoration: none;
}
.single-project .projectInfo {
  font-family: bookmania, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: var(--wp--preset--font-size--large);
  display: none;
  opacity: 0;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 1000;
  transform: translateY(100%);
  transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
  background-color: #464646;
  color: white;
  padding: 5%;
  display: flex;
}
.single-project .projectInfo h1,
.single-project .projectInfo h2 {
  font-family: bookmania, sans-serif;
  font-weight: 400;
  font-style: normal;
  font-size: var(--wp--preset--font-size--large);
  margin-bottom: 2px;
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}
.single-project .projectInfo h1 {
  text-decoration: underline;
}
.single-project .projectInfo .closeModal {
  position: absolute;
  top: 40px;
  right: 40px;
  display: block;
  height: 34px;
  width: 34px;
}
.single-project .projectInfo .closeModal::before,
.single-project .projectInfo .closeModal::after {
  content: '';
  width: 100%;
  height: 1px;
  background-color: white;
  transform-origin: center;
  transform: rotate(45deg);
  position: absolute;
  top: 50%;
  left: 0;
}
.single-project .projectInfo .closeModal::after {
  transform: rotate(135deg);
}
.single-project .projectInfo .projectTitle,
.single-project .projectInfo .projectText {
  margin-bottom: 36px;
}
.single-project .projectInfo .projectTitle,
.single-project .projectInfo .projectText,
.single-project .projectInfo .projectDeliverables {
  max-width: 620px;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}
.single-project .projectInfo .projectText h2,
.single-project .projectInfo .projectDeliverables h2 {
  text-decoration: underline;
}
.single-project .projectInfo .projectDeliverables {
  flex-shrink: 1;
}
.single-project .projectInfo .projectDeliverables,
.single-project .projectInfo .projectDeliverables h2 {
  font-family: 'aktiv-grotesk-extended', sans-serif;
  font-size: 16px;
}
.single-project .projectInfo .projectDeliverables li {
  text-transform: lowercase;
}
.single-project .projectInfo .projectText {
  flex-basis: 100%;
  flex-grow: 1;
}
.single-project .projectInfo.open {
  display: flex;
  flex-flow: column nowrap;
  justify-content: space-between;
  opacity: 1;
  transform: translateY(0);
  transition: transform 0.2s ease-in-out, opacity 0.2s ease-in-out;
}
.single-project .projectInfo.open .projectTitle,
.single-project .projectInfo.open .projectText,
.single-project .projectInfo.open .projectDeliverables {
  opacity: 1;
  transition-property: opacity;
  transition-duration: 0.8s;
}
.single-project .projectInfo.open .projectTitle {
  transition-delay: 0.2s;
}
.single-project .projectInfo.open .projectText {
  transition-delay: 0.6s;
}
.single-project .projectInfo.open .projectDeliverables {
  transition-delay: 1s;
}
.single-project .hiddenContentWrapper p {
  font-size: var(--wp--preset--font-size--xlarge);
  text-align: center;
}
.single-project .hiddenContentWrapper .toggleContent {
  font-size: var(--wp--preset--font-size--xlarge);
  display: block;
  text-align: center;
  margin: 16px auto;
  font-weight: 300;
}
/* client logos */
#clientGrid {
  row-gap: 24px;
  margin-bottom: 24px;
}
