About

<div id="page" class="site relative z-10 bg-black">

    <header id="site-header" class="c-header absolute pin-t z-50 pin-l w-full md:py-0 md:flex md:items-center md:justify-end" data-bg-item>
        <a href="/" class="c-header__logo text-black absolute pin-l z-50 px-1-5 md:px-2 lg:px-3">
		<span class="u-vh">Our Name is Mud</span>
			<i class="icon icon--ui-logo">
		<svg>
			<use class="no-barba pointer-events-none" xlink:href="#ui-logo"></use>
		</svg>
	</i>

	</a>

        <a id="nav-btn" href="#site-menu" data-menu-opener class="o-burger block md:hidden absolute pin-r mr-1-25 z-20 c-nav__btn lg:hidden">
		<span class="u-vh">Open Menu</span>
		<span class="o-burger__slice o-burger__slice--top absolute h-px bg-white"></span>
		<span class="o-burger__slice o-burger__slice--bot absolute h-px bg-white"></span>
	</a>

        <nav id="site-menu" role="navigation" aria-label="Main menu" class="z-10 px-1-5 pt-7 pin-l pin-t w-full fixed min-h-screen invisible opacity-0 pointer-events-none md:px-2 md:my-0 md:p-0 md:min-h-px  md:relative md:pin-r md:opacity-100 md:visible md:pointer-events-auto lg:px-3">
            <div id="site-menu-inner" class="w-full md:flex md:items-center md:flex-row md:p-0 md:justify-end">
                <ul class="list-reset mb-5 md:mb-0 md:flex">
                    <li role="menuitem" class="c-nav__item  text-ms6 md:text-ms1 md:mr-1-25 mb-1 md:mb-0">
                        <a class="c-nav__link linkee block no-underline md:py-1 md:px-1 md:relative text-white font-bold leading-none" href="/components/preview/listing"><span class="">Projects</span></a>
                    </li>
                    <li role="menuitem" class="c-nav__item  text-ms6 md:text-ms1  mb-1 md:mb-0">
                        <a class="c-nav__link linkee block no-underline md:py-1 md:px-1 md:relative text-white font-bold leading-none" href="/components/preview/about"><span class="">About</span></a>
                    </li>
                    <li role="menuitem" class="c-nav__item  text-ms6 md:text-ms1  mb-1 md:mb-0">
                        <a class="c-nav__link linkee block no-underline md:py-1 md:px-1 md:relative text-white font-bold leading-none" href="/components/preview/journal"><span class="">Journal</span></a>
                    </li>
                    <li role="menuitem" class="c-nav__item  text-ms6 md:text-ms1  mb-1 md:mb-0">
                        <a id="contact-link" data-contact-link class="c-nav__link linkee block no-underline md:py-1 md:px-1 md:relative text-white font-bold leading-none" href="/components/preview/contact"><span class="">Contact</span></a>
                    </li>
                </ul>
                <div class="md:hidden">
                    <a class="block text-white no-underline font-light text-sm" href="tel:01225 471 465">01225 471 465</a>
                    <a class="block text-white no-underline font-light text-sm" href="mailto:hello@ournameismud.co.uk">hello@ournameismud.co.uk</a>
                    <a class="block text-white no-underline font-light text-sm" href="{ twitter }}">@asclearasmud</a>
                </div>
            </div>
        </nav>
    </header>
    <div id="container" class="trans">
        <main id="barba-wrapper" class="w-full bg-white trans overflow-hidden">
            <div class="barba-container bg-white">
                <div class="mb-2-5 lg:mb-8">

                    <div class="c-hero c-hero__clip bg-gradient bg-black pt-6 pb-3  md:pt-10 md:pb-5 xl:pb-6">
                        <svg class="absolute pin" style="overflow: visible" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1622.963 792.478" data-lines data-spon-track="true">
		<linearGradient id='grad1'>
			<stop stop-color='#0e0f26'/>
			<stop data-stop-color offset='30%' stop-color='#671eb8'/>
		</linearGradient>
		<linearGradient id='grad2'>
			<stop stop-color='#28BBDE'/>
			<stop data-stop-color offset='90%' stop-color='#1C1E4B'/>
		</linearGradient>
		<linearGradient id='grad3'>
			<stop stop-color='#0e0f26'/>
			<stop data-stop-color offset='70%' stop-color='#ffffff'/>
		</linearGradient>
		<linearGradient id='grad4'>
			<stop stop-color='#671EB8'/>
			<stop data-stop-color offset='70%' stop-color='#1C1E4B'/>
		</linearGradient>
		<path data-speed="-0.3" class="opacity-0" data-spon-track data-path fill="none" stroke="url(#grad1)" stroke-opacity="0.7" stroke-miterlimit="10" stroke-width="9" d="M552.444 1.477l332.299 713.979 783.92-349.909"/>
		<path data-speed="-0.6" class="opacity-0" data-spon-track data-path fill="none" stroke="url(#grad3)" stroke-opacity="0.5" stroke-miterlimit="10" stroke-width="9" d="M2.912 429.659c2 3 255.83 203.797 255.83 203.797l-255.83 32.52"/>
		<path data-speed="-0.26" class="opacity-0" data-spon-track data-path fill="none" stroke="url(#grad2)" stroke-opacity="0.7" stroke-miterlimit="10" stroke-width="9" d="M1670.306 99.759l-645.563 183.697 654.622 380"/>
		<path data-speed="-0.49" class="opacity-0" data-spon-track data-path fill="none" stroke="url(#grad4)" stroke-opacity="0.5" stroke-miterlimit="10" stroke-width="9" d="M1668.663 269.832l-249.92 410.624 251.563 141.554"/>
	</svg>
                        <div class="p-1-5 md:px-2 lg:px-3 xl:wrapper">
                            <div class="md:w-su-16/24">
                                <h1 class="text-h2 font-light text-white relative z-50" data-motion-text data-speed="0.2">
                                    We're a small but perfectly formed web design agency, based in beautiful bath.
                                </h1>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="mb-2-5 lg:mb-8 xl:mb-12" data-motion-reveal>

                    <div class="c-block">
                        <div class="c-block__md">
                            <div class="w-full relative image-container" style="padding-top: 66.68%">
                                <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1600w" alt="Unsplash Placeholder 4" />
		</noscript>
                                <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=768"
                                    data-srcset="https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1600w"
                                    alt="Unsplash Placeholder 4" />
                            </div>

                        </div>
                        <div class="c-block__bd c-block__bd--intro">
                            <h2 class="text-h4 text-black mb-1-5">Curiously creative digital.</h2>
                            <div class="text-black text-lg font-light">
                                <p>Making great websites is what gets us out of bed in the mornings. Websites that look great, are a pleasure to use, and make a real difference to our clients. Taking pleasure in the nitty gitty, and taking time to find out
                                    what makes you special to your customers, are at the heart of what we do. </p>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="mb-2-5 lg:mb-8 xl:mb-12 px-1-5 md:px-2 lg:px-3 xl:wrapper">
                    <h2 class="text-h2 mb-2-5 text-black">Meet the team</h2>
                    <div class="md:flex md:flex-wrap xl:justify-between">
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24 md:mr-su2 xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Matt" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Matt" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Matt was once invited by his heroes, Belle and Sebastian, to DJ at the Brixton Academy. Well, in the dark shadows right at the back of the Brixton Academy, to be precise.</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Matt Powell</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Creative Director</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>As a passionate advocate of good design in all its forms, Matt heads up our creative team. So determined is he to get right to the heart of our clients’ businesses, his levels of curiosity almost border on the nosey. <br
                                        /></p>
                                </div>
                                <a href="mailto:matt@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>matt@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24  xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Cole" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Cole" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Cole has a PHD in archaeology and was once on Time Team with Tony Robinson. (Insert ancient relic joke here.) </p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Cole Henley</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Technical Director</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>A voice of authority on development standards, responsive design and accessibility. Cole’s background lends itself to creative and user-friendly work. When he’s not at Mud, he can be found speaking at industry conferences
                                        and lecturing at Greenwich University.  </p>
                                </div>
                                <a href="mailto:cole@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>cole@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24 md:mr-su2 xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Dave" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Dave" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Dave has odd shaped ears.</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Dave Maxwell-Wood</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Senior Developer</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Dave the First is a designer-developer and all round good egg. He loves implementing designs, adding his own spin and turning out beautiful, super-efficient websites. A shy soul, Dave doesn’t want us to mention that
                                        he likes cooking and badminton.</p>
                                </div>
                                <a href="mailto:dave@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>dave@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24  xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Max" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Max" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Max is an ex-child model. Or ex child-model? Either way, donning a pair of Liverpool pyjamas for the cameras is unquestionably the nadir of his modelling career. (Despite his impish demeanour, this was quite
                                                some time ago.)</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Max Saunders</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Senior Designer</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Max knows how to make a beautiful looking website, which is lucky really, as that's what he's paid to do. With a background in branding and digital design, Max is full of ideas and great at executing them.</p>
                                </div>
                                <a href="mailto:max@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>max@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24 md:mr-su2 xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Stockley" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Stockley" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Dave used to write a satirical website called Newsfisted. It never quite made the impact we're sure it deserved.</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Dave Stockley</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Senior Developer</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Dave the Second joined us as a whizz-bang creative developer, bringing with him his own esoteric style of code mangling. Dave had made a formal challenge to Cole for title of ‘most established beard at Mud’, but a recent
                                        encounter with a Gillette has left him floundering in second place.</p>
                                </div>
                                <a href="mailto:leon@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>leon@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24  xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Meg" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Meg" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Meg and her two siblings broke their wrists on the same day of their holiday, within hours of each other. An event so unlikely, they were pulled aside by airport security who thought they were smugglers.</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Meg</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Digital Project Manager </h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Meg brings her impeccable organisation skills to Mud, along with her not inconsiderable creative thinking and client services abilities. Meg supports Manchester Utd, which almost meant she was excluded from the recruitment
                                        process. But we were so impressed with her that Matt was (reluctantly) willing to let this go.</p>
                                </div>
                                <a href="mailto:meg@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>meg@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24 md:mr-su2 xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Michelle" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Michelle" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Michelle spent a few months living and working in the oldest (former) prison in New Zealand, now a backpackers and tourist attraction and supposedly home to the ghosts of some former prisoners. Haunting.</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Michelle Barker</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Front-end developer</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Michelle joined Mud in 2015 as a specialist front-end developer. Aside from being a brilliant developer, Michelle is also a talented illustrator, prolific writer and occassional speaker at web events. She is now officially
                                        known within Mud as the Queen of the Grids.</p>
                                </div>
                                <a href="mailto:michelle@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>michelle@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24  xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w" alt="Rich" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=768" data-srcset="https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w"
                                            alt="Rich" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Rich has never eaten a whole piece of fruit. Except for a tomato.</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Rich George</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Web Developer</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Rich is a talented all round developer, and a favourite of the project managers due to his super efficient diligence with his timesheets. Rich qualified from UWE with a first class degree in Web Design, making him the
                                        most qualified member of the Mud team. </p>
                                </div>
                                <a href="mailto:rich@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>rich@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24 md:mr-su2 xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=1024 800w" alt="Placeholder Square" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768"
                                            data-srcset="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=1024 800w"
                                            alt="Placeholder Square" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>Some stuff here</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Triana Hamilton</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Developer</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Some stuff here</p>
                                </div>
                                <a href="mailto:triana@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>triana@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                        <div data-motion-reveal class="mb-2 md:w-su2-12/24  xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">

                            <div class="c-person pb-1-5">
                                <div class="mb-1-5 relative c-person__flip overflow-hidden">
                                    <div class="w-full relative image-container" style="padding-top: 100%">
                                        <noscript>
			<img class="absolute pin object-fit w-full h-full" src="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768" srcset="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=1024 800w" alt="Placeholder Square" />
		</noscript>
                                        <img class="lazyload absolute pin object-fit w-full h-full " src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" data-src="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768"
                                            data-srcset="https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=1024 800w"
                                            alt="Placeholder Square" />
                                    </div>

                                    <div class="opacity-0 z-10 absolute c-person__target p-2-5 hidden lg:block">
                                        <h2 class="text-white text-h4 mb-0-25 c-person__fact mb-1-5">Curious fact</h2>
                                        <div class="text-white font-light text-lg mb-1-5 c-person__fact">
                                            <p>While slightly inebriated at University, Emma agreed to go on Eggheads. She went on to win £16k, and the team is listed on Wikipedia as being the most unlikely win in Eggheads history. Emma agrees with this
                                                assessment.</p>
                                        </div>
                                    </div>
                                </div>
                                <h2 class="text-black text-h4 mb-0-25">Emma Thorpe</h2>
                                <h5 class="text-black font-light text-lg mb-0-75">Project Manager</h5>
                                <div class="text-black font-light text-lg mb-0-75">
                                    <p>Emma is part of our project management team, and brings a bubbly enthusiasm to our team and our clients. Primarily responsible for dealing with all existing client enquiries, Emma co-ordinates the team and keeps them
                                        in line. </p>
                                </div>
                                <a href="mailto:emma@ournameismud.co.uk" class="text-black inline-flex font-bold text-blue hover:text-blue text-sm linkee linkee--blue">
		<span>emma@ournameismud.co.uk</span>
	</a>
                            </div>
                        </div>
                    </div>
                </div>

            </div>

        </main>
    </div>

    <footer class="c-footer pt-6 pb-0 md:pt-8 xl:pt-14 bg-black text-white text-h4 font-light relative overflow-hidden z-100">
        <svg class="absolute pin z-0" style="overflow: visible" data-lines xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1622.963 571.563">
		<linearGradient id='cta-grad1'>
			<stop stop-color='#0e0f26'/>
			<stop data-stop-color offset='30%' stop-color='#671eb8'/>
		</linearGradient>
		<linearGradient id='cta-grad2'>
			<stop stop-color='#28BBDE'/>
			<stop data-stop-color offset='50%' stop-color='#1C1E4B'/>
			<stop data-stop-color offset='90%' stop-color='#28BBDE'/>
		</linearGradient>
		<path data-speed="-0.58" class="opacity-0" data-spon-track data-path fill="none" stroke="url(#cta-grad1)" stroke-opacity="0.7" stroke-miterlimit="10" stroke-width="9" d="M1042.044 1.971l227.612 334.075 515.797-310.067"/>
		<path data-speed="-0.59" class="opacity-0" data-spon-track data-path fill="none" stroke="url(#cta-grad2)" stroke-opacity="0.7" stroke-miterlimit="10" stroke-width="9" d="M1669.292 21.926L913.734 237.454 3.211 2336.1"/>
	</svg>
        <div class="px-1-5 md:px-2 lg:px-3 xl:wrapper relative z-10">
            <div class="lg:w-su-17/24 xl:w-su-13/24 mb-5 lg:mb-7 c-cta">
                <p>We love to talk digital. So if there’s a project that you’re itching to start or you just want to introduce yourself, drop us a line. We’re always happy to chat.</p>
            </div>

            <div class="pb-4 md:flex md:items-start">
                <address class="text-white font-light text-xs whitespace-pre-line mb-2 md:mb-0 md:mr-2 lg:mr-4">5 Princes Buildings 
Bath 
BA1 2ED</address>
                <dl class="flex flex-col items-start justify-start mb-2 md:mb-0">
                    <dt class="u-vh">Tel</dt>
                    <dd>
                        <a class="block text-white linkee linkee--sm no-underline font-light text-xs" href="tel:01225 471 465"><span>01225 471 465</span></a>
                    </dd>
                    <dt class="u-vh">Email</dt>
                    <dd>
                        <a class="block text-white linkee linkee--sm no-underline font-light text-xs" href="mailto:hello@ournameismud.co.uk"><span>hello@ournameismud.co.uk</span></a>
                    </dd>
                    <dt class="u-vh"></dt>
                    <dd>
                        <a class="block text-white linkee linkee--sm no-underline font-light text-xs" href="asclearasmud"><span>@asclearasmud</span></a>
                    </dd>
                </dl>
                <p class="text-white text-xs font-light md:ml-auto text-right">&copy; 2018 Our Name is Mud <br /><span class="opacity-50">Company No. 8589415</span></p>
            </div>
        </div>
    </footer>

</div>
<div class="c-draw hidden fixed pin-t pin-r h-screen w-full max-w-md bg-black z-0 p-1 md:p-3 xl:p-3 overflow-auto">
    <h2 class="text-h3 text-white mb-1-5 font-light">We're a small but perfectly formed web design agency, based in beautiful bath. </h2>
    <div class="text-white text-body mb-3"></div>

    <ul class="list-reset">
        <li class="mb-1">
            <h2 class="text-h6 mb-0-5 text-white">Call us</h2>
            <a href="tel:01225 471 465" class="inline-flex font-bold text-body text-blue linkee"><span>01225 471 465</span></a>
        </li>
        <li class="mb-1">
            <h2 class="text-h6 mb-0-5 text-white">General enquiries</h2>
            <a href="mailto:hello@ournameismud.co.uk" class="inline-flex font-bold text-body text-blue linkee"><span>hello@ournameismud.co.uk</span></a>
        </li>
        <li class="mb-1">
            <h2 class="text-h6 mb-0-5 text-white">Follow</h2>
            <a target="_blank" rel="noopener" href="asclearasmud" class="inline-flex font-bold text-body text-blue linkee"><span>@asclearasmud</span></a>
        </li>
        <li>
            <h2 class="text-h6 mb-0-5 text-white">Visit us</h2>
            <address class="block font-light text-body text-white mb-1-5">5 Princes Buildings 
Bath 
BA1 2ED</address>
            <a href="https://goo.gl/maps/S6RQRy8kSQT2" class="o-btn text-sm flex flex-no-wrap justify-end relative items-center text-white" target="_blank">
  <span class="o-btn__line h-px flex-1 mr-0-5 w-full bg-currentColor opacity-25 block"></span>
  <span class="block ml-auto mr-0 whitespace-no-wrap">View on Google Maps</span>
</a>
        </li>
    </ul>
</div>

<div id="cursor">
    <div id="c1"></div>
</div>
{% import '@helpers' as h %}

{% extends craft.app.config.general.custom.wrapper ~ '_layout.twig' %}

{% block critical_css %}
	<!-- build:critical-->
	<!-- endbuild -->
{% endblock %}


{% block content %}
<div class="barba-container bg-white">
	<div class="mb-2-5 lg:mb-8">
		{% include '@hero--about' with hero %}
	</div>
	
	<div class="mb-2-5 lg:mb-8 xl:mb-12" data-motion-reveal>
		{% include '@block--intro' with intro %}
	</div>

	<div class="mb-2-5 lg:mb-8 xl:mb-12 px-1-5 md:px-2 lg:px-3 xl:wrapper">
		<h2 class="text-h2 mb-2-5 text-black">Meet the team</h2>
		<div class="md:flex md:flex-wrap xl:justify-between">
			{% for person in team %}
				<div data-motion-reveal class="mb-2 md:w-su2-12/24 {{ loop.index0 % 2 == 0 ? 'md:mr-su2' : '' }} xl:mr-0 xl:w-su2-12/24 max:w-su2-8/24">
					{% include '@person' with person %}
				</div>
			{% endfor %}
		</div>
	</div>

</div>

{% endblock %}
{
  "siteTitle": "Mudstone Component Library",
  "craft": {
    "app": {
      "config": {
        "general": {
          "custom": {
            "wrapper": "/wrapper/"
          }
        }
      }
    }
  },
  "tel": "01225 471 465",
  "phone": "01225 471 465",
  "email": "hello@ournameismud.co.uk",
  "twitter": "asclearasmud",
  "copyright": "&copy; 2018 Our Name is Mud",
  "siteUrl": "/components/preview/home",
  "address": "5 Princes Buildings \nBath \nBA1 2ED",
  "cta": "<p>We love to talk digital. So if there’s a project that you’re itching to start or you just want to introduce yourself, drop us a line. We’re always happy to chat.</p>",
  "entries": [
    {
      "title": "Projects",
      "url": "/components/preview/listing"
    },
    {
      "title": "About",
      "url": "/components/preview/about"
    },
    {
      "title": "Journal",
      "url": "/components/preview/journal"
    },
    {
      "title": "Contact",
      "url": "/components/preview/contact"
    }
  ],
  "hero": {
    "heading": "We're a small but perfectly formed  web design agency, based in beautiful bath. "
  },
  "intro": {
    "heading": "Curiously creative digital.",
    "body": "<p>Making great websites is what gets us out of bed in the mornings. Websites that look great, are a pleasure to use, and make a real difference to our clients. Taking pleasure in the nitty gitty, and taking time to find out what makes you special to your customers, are at the heart of what we do. </p>",
    "image": {
      "id": "55",
      "url": "https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
      "aspect": 66.68,
      "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
      "srcset": "https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/media/unsplash-placeholder-4.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1600w",
      "alt": "Unsplash Placeholder 4"
    }
  },
  "process": [
    {
      "heading": "Row A",
      "body": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras molestie nibh facilisis mauris eleifend, in finibus purus condimentum. Suspendisse ligula mauris, condimentum quis urna congue, dignissim volutpat massa. Nunc a felis vulputate odio iaculis tristique. Duis ultrices lorem nec gravida volutpat. Sed eu venenatis massa.</p>"
    },
    {
      "heading": "Row B",
      "body": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras molestie nibh facilisis mauris eleifend, in finibus purus condimentum. Suspendisse ligula mauris, condimentum quis urna congue, dignissim volutpat massa. Nunc a felis vulputate odio iaculis tristique. Duis ultrices lorem nec gravida volutpat. Sed eu venenatis massa.</p>"
    },
    {
      "heading": "Row C",
      "body": "<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras molestie nibh facilisis mauris eleifend, in finibus purus condimentum. Suspendisse ligula mauris, condimentum quis urna congue, dignissim volutpat massa. Nunc a felis vulputate odio iaculis tristique. Duis ultrices lorem nec gravida volutpat. Sed eu venenatis massa.</p>"
    }
  ],
  "team": [
    {
      "image": {
        "id": "444",
        "url": "https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//matt.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Matt"
      },
      "name": "Matt Powell",
      "job": "Creative Director",
      "body": "<p>As a passionate advocate of good design in all its forms, Matt heads up our creative team. So determined is he to get right to the heart of our clients’ businesses, his levels of curiosity almost border on the nosey. <br /></p>",
      "email": "matt@ournameismud.co.uk",
      "fact": "<p>Matt was once invited by his heroes, Belle and Sebastian, to DJ at the Brixton Academy. Well, in the dark shadows right at the back of the Brixton Academy, to be precise.</p>"
    },
    {
      "image": {
        "id": "442",
        "url": "https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//cole.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Cole"
      },
      "name": "Cole Henley",
      "job": "Technical Director",
      "body": "<p>A voice of authority on development standards, responsive design and accessibility. Cole’s background lends itself to creative and user-friendly work. When he’s not at Mud, he can be found speaking at industry conferences and lecturing at Greenwich University.  </p>",
      "email": "cole@ournameismud.co.uk",
      "fact": "<p>Cole has a PHD in archaeology and was once on Time Team with Tony Robinson. (Insert ancient relic joke here.) </p>"
    },
    {
      "image": {
        "id": "443",
        "url": "https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//dave.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Dave"
      },
      "name": "Dave Maxwell-Wood",
      "job": "Senior Developer",
      "body": "<p>Dave the First is a designer-developer and all round good egg. He loves implementing designs, adding his own spin and turning out beautiful, super-efficient websites. A shy soul, Dave doesn’t want us to mention that he likes cooking and badminton.</p>",
      "email": "dave@ournameismud.co.uk",
      "fact": "<p>Dave has odd shaped ears.</p>"
    },
    {
      "image": {
        "id": "449",
        "url": "https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//max.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Max"
      },
      "name": "Max Saunders",
      "job": "Senior Designer",
      "body": "<p>Max knows how to make a beautiful looking website, which is lucky really, as that's what he's paid to do. With a background in branding and digital design, Max is full of ideas and great at executing them.</p>",
      "email": "max@ournameismud.co.uk",
      "fact": "<p>Max is an ex-child model. Or ex child-model? Either way, donning a pair of Liverpool pyjamas for the cameras is unquestionably the nadir of his modelling career. (Despite his impish demeanour, this was quite some time ago.)</p>"
    },
    {
      "image": {
        "id": "448",
        "url": "https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//stockley.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Stockley"
      },
      "name": "Dave Stockley",
      "job": "Senior Developer",
      "body": "<p>Dave the Second joined us as a whizz-bang creative developer, bringing with him his own esoteric style of code mangling. Dave had made a formal challenge to Cole for title of ‘most established beard at Mud’, but a recent encounter with a Gillette has left him floundering in second place.</p>",
      "email": "leon@ournameismud.co.uk",
      "fact": "<p>Dave used to write a satirical website called Newsfisted. It never quite made the impact we're sure it deserved.</p>"
    },
    {
      "image": {
        "id": "445",
        "url": "https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//meg.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Meg"
      },
      "name": "Meg",
      "job": "Digital Project Manager ",
      "body": "<p>Meg brings her impeccable organisation skills to Mud, along with her not inconsiderable creative thinking and client services abilities. Meg supports Manchester Utd, which almost meant she was excluded from the recruitment process. But we were so impressed with her that Matt was (reluctantly) willing to let this go.</p>",
      "email": "meg@ournameismud.co.uk",
      "fact": "<p>Meg and her two siblings broke their wrists on the same day of their holiday, within hours of each other. An event so unlikely, they were pulled aside by airport security who thought they were smugglers.</p>"
    },
    {
      "image": {
        "id": "446",
        "url": "https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//michelle.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Michelle"
      },
      "name": "Michelle Barker",
      "job": "Front-end developer",
      "body": "<p>Michelle joined Mud in 2015 as a specialist front-end developer. Aside from being a brilliant developer, Michelle is also a talented illustrator, prolific writer and occassional speaker at web events. She is now officially known within Mud as the Queen of the Grids.</p>",
      "email": "michelle@ournameismud.co.uk",
      "fact": "<p>Michelle spent a few months living and working in the oldest (former) prison in New Zealand, now a backpackers and tourist attraction and supposedly home to the ghosts of some former prisoners. Haunting.</p>"
    },
    {
      "image": {
        "id": "447",
        "url": "https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=1024 1024w, https://mud-assets.imgix.net/team//rich.jpg?auto=format%2Ccompress&fit=max&q=93&w=1600 1400w",
        "alt": "Rich"
      },
      "name": "Rich George",
      "job": "Web Developer",
      "body": "<p>Rich is a talented all round developer, and a favourite of the project managers due to his super efficient diligence with his timesheets. Rich qualified from UWE with a first class degree in Web Design, making him the most qualified member of the Mud team. </p>",
      "email": "rich@ournameismud.co.uk",
      "fact": "<p>Rich has never eaten a whole piece of fruit. Except for a tomato.</p>"
    },
    {
      "image": {
        "id": "30",
        "url": "https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=1024 800w",
        "alt": "Placeholder Square"
      },
      "name": "Triana Hamilton",
      "job": "Developer",
      "body": "<p>Some stuff here</p>",
      "email": "triana@ournameismud.co.uk",
      "fact": "<p>Some stuff here</p>"
    },
    {
      "image": {
        "id": "30",
        "url": "https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=768 768w, https://mud-assets.imgix.net/team//placeholder-square.png?auto=format%2Ccompress&fit=max&q=93&w=1024 800w",
        "alt": "Placeholder Square"
      },
      "name": "Emma Thorpe",
      "job": "Project Manager",
      "body": "<p>Emma is part of our project management team, and brings a bubbly enthusiasm to our team and our clients. Primarily responsible for dealing with all existing client enquiries, Emma co-ordinates the team and keeps them in line. </p>",
      "email": "emma@ournameismud.co.uk",
      "fact": "<p>While slightly inebriated at University, Emma agreed to go on Eggheads. She went on to win £16k, and the team is listed on Wikipedia as being the most unlikely win in Eggheads history. Emma agrees with this assessment.</p>"
    }
  ],
  "clients": [
    {
      "image": {
        "id": "32",
        "url": "https://mud-assets.imgix.net/clients//placeholder-square-3fba91.png?auto=format%2Ccompress&fit=max&q=93&w=768",
        "aspect": 100,
        "src": "data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20width%3D%271%27%20height%3D%271%27%20style%3D%27background%3Atransparent%27%2F%3E",
        "srcset": "https://mud-assets.imgix.net/clients//placeholder-square-3fba91.png?auto=format%2Ccompress&fit=max&q=93&w=768 200w",
        "alt": "Placeholder Square 3Fba91"
      },
      "name": "Client name",
      "url": "https://dyoung.com"
    }
  ]
}

There are no notes for this item.