/* Minification failed. Returning unminified contents.
(452,20): run-time error CSS1030: Expected identifier, found '.'
(452,33): run-time error CSS1031: Expected selector, found ')'
(452,33): run-time error CSS1025: Expected comma or open brace, found ')'
 */
ins,mark{color:#000}article,aside,details,figcaption,figure,footer,header,hgroup,hr,menu,nav,section{display:block}dfn,mark{font-style:italic}button,hr,input{overflow:visible}a,progress,sub,sup{vertical-align:baseline}[type=checkbox],[type=radio],legend{box-sizing:border-box;padding:0}abbr,address,article,aside,audio,b,blockquote,body,canvas,caption,cite,code,dd,del,details,dfn,div,dl,dt,em,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,p,pre,q,samp,section,small,span,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,ul,var,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:0 0}body{line-height:1;margin:0}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:'';content:none}a{margin:0;padding:0;font-size:100%;background:0 0;-webkit-text-decoration-skip:objects}ins{background-color:#ff9;text-decoration:none}mark{font-weight:700;background-color:#ff0}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{border:0;border-top:1px solid #ccc;margin:1em 0;padding:0;box-sizing:content-box;height:0}input,select{vertical-align:middle}.clearfix:after,.clearfix:before{display:table;line-height:0;content:""}audio,canvas,progress,video{display:inline-block}.clearfix:after{clear:both}input,select,textarea{-webkit-border-radius:0;-moz-border-radius:0;border-radius:0}input[type=submit]{-webkit-appearance:none}ol li,ul li{font-size:inherit;color:inherit;line-height:inherit}/*! normalize.css v7.0.0 | MIT License | github.com/necolas/normalize.css */html{line-height:1.15;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}figure{margin:1em 40px}code,kbd,pre,samp{font-family:monospace,monospace;font-size:1em}abbr[title]{border-bottom:none;text-decoration:underline;text-decoration:underline dotted}b,strong{font-weight:bolder}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative}sub{bottom:-.25em}sup{top:-.5em}audio:not([controls]){display:none;height:0}img{border-style:none}svg:not(:root){overflow:hidden}button,input,optgroup,select,textarea{font-size:100%;line-height:1.15;margin:0;font-family:inherit}button,select{text-transform:none}[type=reset],[type=submit],button,html [type=button]{-webkit-appearance:button}[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{border-style:none;padding:0}[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring,button:-moz-focusring{outline:ButtonText dotted 1px}fieldset{padding:.35em .75em .625em}legend{color:inherit;display:table;max-width:100%;white-space:normal}textarea{overflow:auto}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-cancel-button,[type=search]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}summary{display:list-item}[hidden],template{display:none}button,input[type=submit]{cursor:pointer;}
/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;

    margin: 0;
    padding: 0;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-slider .slick-track,
.slick-slider .slick-list
{
    -webkit-transform: translate3d(0, 0, 0);
       -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
         -o-transform: translate3d(0, 0, 0);
            transform: translate3d(0, 0, 0);
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

/* PLACEHOLDER */
::-webkit-input-placeholder     {color:#bdbdbd;}
::-moz-placeholder              {color:#bdbdbd; opacity:1;}
:-ms-input-placeholder          {color:#bdbdbd;}
:-moz-placeholder               {color:#bdbdbd; opacity:1;}

/* CUSTOM CHECKBOX */
.container {display: block; position: relative; padding-left: 35px; margin-bottom: 12px; cursor: pointer; font-size: 22px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none;}
.container input {position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0;}
.checkmark {position: absolute; top: 0; left: 0; height: 25px; width: 25px; background-color: #eee;}
.container:hover input ~ .checkmark {background-color: #ccc;}
.container input:checked ~ .checkmark {background-color: #2196F3;}
.checkmark:after {content: ""; position: absolute; display: none;}
.container input:checked ~ .checkmark:after {display: block;}
.container .checkmark:after {left: 9px; top: 5px; width: 5px; height: 10px; border: solid white; border-width: 0 3px 3px 0; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg);}

/* RADIO RADIO */
.container.radio-container	.checkmark 			{border-radius: 25px;}
.container.radio-container .checkmark:after		{border:none; width: 11px; height: 11px; left: 50%; margin-left: -5.5px; top:50%; margin-top: -5.5px; border-radius: 5px; background-color: #ffffff}

/* FRONT END 

Checkbox

<label class="container">One
  <input type="checkbox" checked="checked">
  <span class="checkmark"></span>
</label>

Radio
<label class="container radio-container">One
  <input type="radio" checked="checked" id="radioOne" name="radioGroup">
  <span class="checkmark"></span>
</label>
<label class="container radio-container">Two
  <input type="radio" id="radioTwo" name="radioGroup">
  <span class="checkmark"></span>
</label>

*/

/* CUSTOM SELECT */
.select-css 			{display: block; font-size: 14px; line-height: 1.3; padding: .6em 1.4em .5em .8em; width: 100%;  max-width: 100%; box-sizing: border-box; margin: 0; border-radius: 5px; -moz-appearance: none; -webkit-appearance: none;   appearance: none;
						background-color: #eee; background-image: url(/_assets/select-arrow.png); background-repeat: no-repeat, repeat; background-position: right 1em top 50%, 0 0; background-size: 22px auto;}

.select-css::-ms-expand {display: none;}
.select-css:focus 		{border-color: #aaa;}
.select-css option 		{font-weight:normal;}




* {margin:0; padding:0; outline:none; border:none; box-sizing:border-box; -moz-box-sizing:border-box;}

/* GLOBAL */

html 	{}
body 	{line-height:1; font-family: 'Arvo', serif; text-rendering: optimizeLegibility; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; background-color: #000000}

h1		{font-weight: 700; font-size: 62px; margin-bottom: 1em}
h2		{font-weight: 700; font-size: 62px; margin-bottom: 1em}
h3		{}
h4		{}
h5		{}
h6		{}

p		{font-family: 'Montserrat', sans-serif; font-size: 19px; line-height: 1.7em; margin-bottom: 1.2em}

p.intro		{font-family: 'Arvo', serif; font-weight: 700; font-size: 28px;}
p a			{text-decoration: none; color: #C2A336; transition: 0.3s ease-out}
p a:hover	{opacity: 0.5}

ul		{list-style: none}
ol		{}

img     {max-width:100%; height:auto;}
a       {color:inherit;}
a.cover {position:absolute; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0); display:block; z-index: 5}
.inner 	{width:1200px; max-width:100%; margin:0 auto; }

.cols			{display: flex; justify-content: space-between}

/* HEADER */
header			{display: flex; justify-content: flex-end; align-items: center; position: relative; padding:25px 45px; }
header .logo	{width: 110px; display: flex; align-items: center; justify-content: center; filter: brightness(100); position: relative;}
header h1		{display: none}

.logo-text		{position: absolute; opacity: 0; animation: 40s logo-text ease-in 0s infinite}
.logo-image		{animation: 40s logo-image ease-in 0s infinite}

@keyframes logo-text {
	0%		{opacity: 0;}
	48%		{opacity: 0;}
	49%		{opacity: 1;}
	50%		{opacity: 1;}
	98%		{opacity: 1;}
	99%		{opacity: 0;}
	100%	{opacity: 0;}
}

@keyframes logo-image {
	0%		{opacity: 1;}
	48%		{opacity: 1;}
	49%		{opacity: 0;}
	50%		{opacity: 0;}
	98%		{opacity: 0;}
	99%		{opacity: 1;}
	100%	{opacity: 1;}
}

/* HAMBURGER */
.hamburger 						{width: 38px; height: 36px; z-index: 30; position: fixed; left: 45px; top:25px; cursor: pointer; transition: 0.3s ease-out}
.hamburger span 				{width: 100%; display: block; height: 6px; background-color: #D9D9D9; position: absolute; top: 0; left: 0; border-radius: 1px; }
.hamburger span:nth-child(1) 	{}
.hamburger span:nth-child(2)	{top: 12px; }
.hamburger span:nth-child(3) 	{top: 24px; }

.home header 			{background-color: #ffffff; justify-content: space-between; padding: 45px;}
.home header .inner 	{}
.home header h1			{margin-left: 12vw; font-size: 28px; display: block; color: #000000}
.home header .logo		{width: 24vw; max-width: 470px; filter: unset}
.home header .hamburger	{top:45px;}

.home .logo			{position: relative; display: flex; flex-direction: column; align-items: flex-start}
.home .logo:after	{width: 75%; height: 22px; background-image: url(/_uploads/_assets/logo-tagline.svg); background-size: contain; background-repeat: no-repeat; margin-top: 10px; content: '';}
.home .logo-text	{display: none;}

.hamburger.hide-hammy		{transform: translateY(-20px); opacity: 0; visibility: hidden;}

.hamburger:hover span		{background-color: #C2A336}

/*
.hamburger.open span:nth-child(1) 	{top: 13px; transform: rotate(45deg) }
.hamburger.open span:nth-child(2) 	{opacity: 0; transform: scale(0) }
.hamburger.open span:nth-child(3) 	{top: 13px; transform: rotate(-45deg)}
*/

.fade	{opacity: 0.1; transition: 0.4s ease-out}

/* NAV */
nav						{position: fixed; left: 0; background-color: #000000; z-index: 99; width: 100%; height: 100%; display: flex; flex-direction: column; padding-top: 60px; padding-bottom: 60px; padding-left: 12vw; top:-100%; transition: 0.7s ease-out}
nav ul					{}
nav ul li				{margin-bottom: 10px; font-size: 0; font-weight: 700; display: block; transition: 0.2s ease-out}
nav ul li a				{color:#000000; background-color: #ffffff; padding: 8px 10px; text-decoration: none; display: inline-block; position: relative; overflow: hidden; font-size: 5vh}
nav ul li a span		{position: relative; z-index: 5}
nav ul li a:after		{position: absolute; top:0; background-color: #C2A336; width: 100%; height: 100%; content: ''; left: -100%; font-size: 0; transition: 0.3s ease-out;}
nav ul li:hover 		{transform: translateX(10px)}
nav ul li:hover a:after	{left: 0;}
nav.open				{top: 0;}

nav ul li ul li a       {font-size: 3vh; margin: 10px 0 0 10px}



.nav-container		{display: flex; flex-direction: column; justify-content: center; flex: 1;}
.nav-container img	{width: 135px; margin-top: 10px;}

.logo-tagline		{position: absolute; right: 60px; top:60px; width: 100px;}

a.close			{transition: 0.3s ease-out}
a.close:hover	{opacity: 0.5}

/* HOMEPAGE HERO */
.homepage-hero				{display: flex;}

.homepage-hero .image-left	{font-size: 0;width:65%;}
.homepage-hero .image-right	{font-size: 0;width:35%;background:#FADED3;background-image: url(/_uploads/page-images/home-hero-car.jpg);background-position: bottom;background-size: contain;}

.homepage-hero video,
.homepage-hero img,
.homepage-hero iframe			{max-width:100%;margin: auto;display: block;}

.full-image	{font-size: 0}

/* TWO COL TEXT */
.two-col-text		{padding: 100px 8vw; background-color: #ffffff}
.two-col-text .col	{width:653px; max-width: calc(50% - 30px); position: relative}
.two-col-text .col p:last-child	{margin-bottom: 0}
	
.two-col-text-wwd .cols				{align-items: center;}
.two-col-text-wwd h2				{margin-bottom: 0.5em}
.two-col-text-wwd p.intro			{width: 500px; max-width: 100%; font-size: 34px;}
.two-col-text-wwd .col-left svg,
.two-col-text-wwd .col-left img		{margin-bottom: 3em;}
.two-col-text-wwd .col-right img	{width: 90%}

.two-col-text-wwd.flipped .cols	{flex-direction: row-reverse}
.two-col-text-wwd .col-left		{padding-left: 3vw}

.dark .two-col-text.two-col-text-hww	{background-color: #FDDAE0}
.dark .two-col-text.two-col-text-hww h2,
.dark .two-col-text.two-col-text-hww p	{color: #000000;}
.dark .two-col-text.two-col-text-hww .col-right	img	{width: 305px; max-width: 100%;}
.dark .two-col-text.two-col-text-hww .cols			{align-items: center}
.dark .two-col-text.two-col-text-hww p a			{text-decoration: none}
.dark .two-col-text.two-col-text-hww p a span		{color:#C2A336}
.dark .two-col-text.two-col-text-hww p a:hover		{color:#C2A336}

.two-col-text.two-col-text-ap .col-right		{display: flex; justify-content: flex-end}
.two-col-text.two-col-text-ap .col-right img	{width: 400px; max-width: 100%;}

.wwd-animation-animation .cls-1 		{fill: #161615; stroke-linejoin: round;}
.wwd-animation-animation .cls-2 		{fill: #fff; animation: 2s fade-in-out ease-in-out infinite;}
.wwd-animation-animation .cls-4 		{fill: #fff;}
.wwd-animation-animation .cls-3, .cls-4 {stroke: none;}

@keyframes fade-in-out {
	
	0%		{opacity: 1}
	50%		{opacity: 0}
	100%	{opacity: 1}
}

.hww-animation .cls-1 {fill: #0f0d12;}

.hww-animation-arrow	{animation: 1.5s arrow-bounce ease-in-out infinite;}

@keyframes arrow-bounce {
	
	0%		{transform: translateY(-5px)}
	50%		{transform: translateY(10px)}
	100%	{transform: translateY(-5px)}
}

/* HOME TEAM */
.home-team					{display: flex; justify-content: center; align-items: center; height: 100vh; min-height: 768px; background-color: #000000}
.home-team-image-container	{width: 962px; max-width: 100%;}

/* HOME TEXT SCROLLY */
.home-text-scrolly			{padding: 12vw 0 0}
.home-text-scrolly	img		{width: 732px; max-width: calc(100% - 60px); margin: auto; display: block}
.scrolly-container			{position: relative; z-index: 2; transform: translateY(-180px)}
.scrolly-outer				{overflow: hidden; padding:0 0 10px 0;}
.scrolly-outer p			{font-size: 3vw; color: #ffffff; font-family: 'Arvo', serif; font-weight: 700; line-height: 1em; margin: 0; cursor: pointer;}
.scrolly-outer p:hover		{color:#C2A336;}
.scrolly-inner				{width: 200vw; position: relative;}

/* HOME CLIENTS */
.home-clients				{padding:50px 8vw 100px 8vw; background-color: #000000; color: #ffffff}
.home-clients h2			{margin-bottom: 0.75em}
.home-clients p				{font-size: 64px; font-family: 'Arvo', serif; line-height: 1em; font-weight: 700}
.home-clients p a			{color:#ffffff;}
.home-clients p a:hover		{color:#C2A336; opacity: 1;}

/* VIDEOS */
.video-container {position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; /*margin-bottom: 30px;*/}
.video-container iframe,
.video-container object,
.video-container embed,
.video-container video	{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.video-loader				{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,0.25);display:flex;justify-content:center;align-items:center;}
.video-loader img			{width:125px;height:125px;}

.video-controls					{position:absolute;bottom:15px;left:-9999px;display:flex;column-gap:1em;width:100%;opacity:0;transition: opacity ease-in-out .15s;}
.video-controls.show			{left:0;opacity:1;}
.video-controls img				{width:25px;cursor:pointer;margin:0;margin-left: 10px;}
.video-controls img:first-child {margin-left: 20px;}
.video-controls img:hover		{opacity:.75;}
.video-controls img.video-fullscreen	{margin-left: auto;margin-right:15px;}

.iframe-container	{position: relative;overflow: hidden; width: 100%;padding-top: 56.25%;}
.iframe-container iframe		{position: absolute;top: 0;left: 0;bottom: 0;right: 0;width: 100%;height: 100%;}

/* PORTFOLIO ITEM */
.portfolio-item					{padding: 50px 8vw; color: #ffffff}
.portfolio-item .cols			{margin-bottom: 100px;}
.portfolio-item .cols.flipped	{flex-direction: row-reverse}
.portfolio-item .cols.narrow	{width: 1333px; max-width: 100%; margin-left: auto; margin-right: auto;}
.portfolio-item .cols.narrower	{width: 1140px; max-width: 100%; margin-left: auto; margin-right: auto;}
.portfolio-item .cols:last-of-type	{margin-bottom: 0}
.portfolio-intro				{}
.portfolio-intro h1				{font-size: 64px; margin-bottom: 0.5em}
.portfolio-intro p					{font-size: 28px; font-family: 'Arvo', serif; line-height: 1.4em}
.portfolio-item .portfolio-col p	{font-family: 'Arvo', serif;}

.portfolio-col			{width:calc(50% - 5vw); position: relative;}
.portfolio-col.full		{width: 100%;}
.portfolio-col p:last-child		{margin-bottom: 0}
.portfolio-item .portfolio-col	{margin-bottom: 0}

.portfolio-centered				{text-align: center;}
.portfolio-centered hr			{width: 50%;margin: 50px auto;border-top-width: 2px;border-color: #C2A336;}
.portfolio-centered h3			{font-size: 25px;line-height: 1.35em;max-width: 80%;margin: auto;color: #C2A336;}

.va-centre				{align-items: center;}
.ha-centre				{justify-content: center;}
.stamp					{position: absolute; left: 30px; bottom: -5vw;}

/* PORTFOLIO LISTING */
.listing-image-container					{position: relative; overflow: hidden;}
.listing-image-overlay						{position: absolute; left: 0; top:0; width: 100%; height: 100%; transition: 0.3s ease-out; background-color: rgba(16,37,68,0.8); display: flex; align-items: center; justify-content: center; text-align: center; opacity: 0; visibility: hidden; transform: translateY(100px)}
.listing-image-overlay p					{font-family: 'Arvo', serif; color: #ffffff; font-weight: 700; font-size: 3vw; overflow: hidden; margin: 0; line-height: 1em; transition: 0.3s ease-out;}
.listing-image-overlay p span				{display: block; }

.listing-image-container hr		{display: block; margin: 10px auto}

.listing-image-container:hover .listing-image-overlay					{opacity: 1; visibility: visible; transform: translateY(0)}
.listing-image-container:hover .listing-image-overlay p span			{transform: translateY(102%); animation: slide-up 0.3s cubic-bezier(0.64, 1.2, 0.67, 1.2) 0.3s forwards;}
.listing-image-container:hover .listing-image-overlay p:last-child span	{animation-delay: 0.4s}



@keyframes slide-up {
	
	0%		{transform: translateY(102%);}
	100%	{transform: translateY(0);}
}

.portfolio-col			{margin-bottom: 50px;}
.portfolio-col.right	{display: flex; justify-content: flex-end;}

.portfolio-listing-section							{padding: 100px 8vw}
.portfolio-listing-section .cols						{flex-wrap: wrap}
.portfolio-col.portrait .listing-image-container	{width: calc(50% - 5vw); font-size: 0}
.portfolio-col.landscape .listing-image-container	{width: calc(75% - 5vw); font-size: 0}

.portfolio-col.first-portfolio-col .listing-image-container	{width: 100%;}

.portfolio-listing-intro-col p:last-child	{margin-bottom: 0}

.spin	{animation: 13s spinner linear 0s infinite;}

@keyframes spinner {
	0%		{transform: rotate(0deg)}	
	100%	{transform: rotate(360deg)}	
}

/* NEXT PREVIOUS */
.next-previous							{padding:10px 8vw 150px 8vw; position: relative;}
.next-previous .cols					{border-top:4px solid #ffffff; border-bottom:4px solid #ffffff; width: 1333px; max-width: 100%; margin-left: auto; margin-right: auto; padding:50px 5vw}
.next-previous:has(.btn.inactive) .btn	{border:0;}

/* TESTIMONIALS */
.testimonials-section			{padding-top: 100px}
.testimonials-section h2		{color:#ffffff !important;padding-left:20px;}
.testimonials-section p			{color: #ffffff; font-family: 'Arvo', serif; font-size: 20px; line-height: 1.5em; margin-bottom: 0.5em}
.testimonials-section cite		{font-size: 23px; color: #C2A336; font-style: normal; font-weight: 700; line-height: 1.2em}
.testimonials-section .inner	{width: 1630px; padding: 0 30px;}
.testimonials-section .cols		{display: flex;}
.testimonials-section .col		{padding: 12px 20px; width: 33.333%;}

/* CONTACT PAGE */
.contact-page .two-col-text p			{color: #ffffff;}
.contact-page .two-col-text p a			{color: #C2A336}
.contact-page .two-col-text p a:hover	{color: #ffffff}

.contact-images				{display: flex; padding: 100px 7vw 100px 7vw; flex-wrap: wrap; justify-content: center;}
.contact-images img			{width: calc(50% - 4vw); margin:2vw;  position: relative}
.contact-images.centre		{justify-content: center;}
.contact-images.full img	{width: 100%}
.contact-images.right		{justify-content: flex-end}
.contact-images.right img	{width: 60%;}

.work-with-us				{padding: 100px 8vw; background-color: #000000}
.work-with-us img			{width: 300px; margin-bottom: 2.5em; max-width: 100%; transform-origin: bottom center; animation: waver 5s infinite ease-in-out;}
.work-with-us p				{color: #ffffff}
.work-with-us-inner			{width: 414px; max-width: 100%; margin: auto}

@keyframes waver {

   0%,100%	{ transform: rotate(15deg)}
   25%	 	{ transform: rotate(-15deg)}
   50%	 	{ transform: rotate(15deg)}
   75%	 	{ transform: rotate(-15deg)}
   99%	 	{ transform: rotate(15deg)}
}

/* ABOUT */
.about-page h1	{color:#C2A336}
.about-page h2	{color:#C2A336}

/* CONTAINED IMAGE */
.contained-image			{padding: 120px 30px; background-color: #FDDAE0}
.contained-image img		{width: 1400px; display: block; margin: auto; max-width: 100%; position: relative;}

/* HOW WE WORK */
.how-we-work-page							{background-color:#ffffff;}
.how-we-work-page .two-col-text				{background-color: transparent; padding-top: 50px;}
.how-we-work-page .two-col-text	 h1			{margin-bottom: 0.5em}
.how-we-work-page .two-col-text	.col-left	{width: 517px;}
.how-we-work-page .two-col-text	.col-right	{width: 517px;}
.how-we-work-page .two-col-text	.col-left p.intro	{font-size: 34px; line-height: 1.4em}

.how-we-work-page .form-panel							{border-color:#FE4C52;}
.how-we-work-page .form-panel a,
.how-we-work-page .form-panel strong					{color:#FE4C52;}
.how-we-work-page .form-panel .form-cell				{border-color:#FE4C52;}
.how-we-work-page .form-panel .form-cell label			{color:#FE4C52;}

.image-with-circle	{position: relative;}
.image-with-circle .circle	{position: absolute; top: -90px; left: -40px;}

.what-we-do .two-col-text-wwd h2	{font-size: 52px;}

.how-we-work-page .form-field-error, .how-we-work-page .error-list p		{color:#000 !important;}

/* FORM SECTION */
.form-section		{padding:50px 0 350px;}
.form-panel			{border:1px solid #C2A336; border-radius: 12px; width: 1337px; max-width: calc(100% - 60px); margin: auto; padding:20px 0 50px 0; position: relative;}
.form-panel .cols	{justify-content: space-between;}
.form-left			{padding-left: 24px; width: 650px; padding-right: 40px; max-width: 100%; flex-shrink: 0}
.form-right			{width: 517px; margin-right: 80px; max-width: 100%; margin-top: 90px; position: relative; z-index: 2}
.form-right p		{font-weight: 700; font-size: 34px; font-family: 'Arvo', serif; line-height: 1.5em}
.form-center		{width: 650px; padding: 0 40px; max-width: 100%; flex-shrink: 0}

.form-panel .download-circle	{background-color: #ffffff; width: 455px; display: flex; justify-content: center; position: absolute; right: 80px; bottom: -150px;}

.form-cell						{display: flex; border-bottom:1px solid #C2A336; padding: 20px 0;position:relative;}
.form-cell .text-box			{width:100%;padding-right:40px;display:flex;align-items:center;}
.form-cell label				{font-family: 'Montserrat', sans-serif; font-size: 19px; color: #C2A336; font-weight: 500; line-height: 1.4em; transition: 0.3s ease-out; margin-right: 10px; padding: 20px 0 20px 40px;}
.form-cell input[type='text'],
.form-cell textarea				{font-family: 'Montserrat', sans-serif; font-size: 19px; color: #000000; font-weight: 500; line-height: 1.4em; background-color: transparent; padding: 20px 0; flex: 1;width:100%;}

.form-cell textarea				{resize:none;}

.form-cell:focus-within			{border-color: #000000}
.form-cell:focus-within	label	{color: #000000; font-weight: 700}

.form-row-submit						{margin-top: 40px;}
.form-row-submit .form-cell				{justify-content: center; padding: 0; border: none}
.form-row-submit .btn					{font-size: 34px; font-family: 'Arvo', serif; font-weight: 700; text-align: center; display:block; color:#000; flex:unset; padding: 10px 40px; background-color: transparent; border-radius: 40px; border:2px solid #000000; transition: 0.3s ease-out}
.form-row-submit .btn:hover				{box-shadow: 0 0 0 2px #000000}

.form-row-textarea .text-box			{flex-direction:column;align-items: flex-start;}
.form-row-textarea .text-box textarea	{padding-left:40px;padding-top:0;}

.form-field-error						{position:absolute;left:40px;top:71px;color:red;font-size:12px;}
.error-list	p							{color:red !important;font-size:16px;margin-left:40px;margin-top:10px;}


/* CONTACT PAGE */
.contact-page .form-cell:focus-within label						{color:#c5ab51;}
.contact-page .form-cell:focus-within							{border-color:#c5ab51;}
.contact-page .form-cell input[type='text'],
.contact-page .form-cell textarea								{color:unset;}
.contact-page .btn												{background:#C2A336;font-size:26px;}

.btn			{display: inline-flex; align-items: center; text-decoration: none; flex: 1; transition: 0.4s ease-in-out; color: #ffffff}
.btn p			{font-size: 64px; font-weight: 700; margin: 0; font-family: 'Arvo', serif; line-height: 1em}
.btn svg		{margin-right: 30px; transition: 0.4s ease-in-out}
.btn.next		{text-align: right}
.btn.next svg	{margin-left: 30px; margin-right: 0; }
.btn.next path,
.btn.previous path	{transition: 0.2s ease-out}

.btn.previous			{border-right: 2px solid #ffffff}
.btn.previous:hover svg	{transform: translateX(-20px);}
.btn.next				{border-left: 2px solid #ffffff; justify-content: flex-end}
.btn.next:hover svg		{transform: translateX(20px);}

.btn.inactive				{visibility:hidden;}

.dark					{color: #ffffff}
.dark .two-col-text		{background-color: #000000;}

.black					{background-color: #000000;}
.black p				{color: #ffffff}

.white					{background-color: #FFFFFF;}
.white header .logo		{filter:unset}
.white .hamburger span 	{background-color: #000000}

.light					{background-color: #FDF4EB;}
.light header .logo		{filter:unset}
.light .hamburger span 	{background-color: #000000}

/* FOOTER */
footer						{background-color: #000000; padding:2vw; border-top:1px solid #ffffff; color: #ffffff;}
footer .cols				{justify-content: flex-start;}
		
.footer-main-nav-container				{}
.footer-main-nav ul						{display: inline-flex; flex-wrap: wrap; font-weight: 700;}
.footer-main-nav ul li					{font-size: 0; margin-right: 6px; margin-bottom: 6px; transition: 0.3s ease-out;}
.footer-main-nav ul li a				{font-size: 2vw; color:#000000; background-color: #ffffff; padding: 8px 10px; text-decoration: none; display: inline-block; position: relative; overflow: hidden; transition: 0.3s ease-out;}
.footer-main-nav ul li a span			{z-index: 5; position: relative;}
.footer-main-nav ul li a:after			{position: absolute; top:0; background-color: #C2A336; width: 100%; height: 100%; content: ''; left: -100%; font-size: 0; transition: 0.3s ease-out;}
.footer-main-nav ul li:hover a:after	{left: 0}
.footer-main-nav ul li a:hover			{transform: translateX(4px);}

.footer-contact-social		{display: flex; align-items: center; margin-top: 10px;}

ul.social-list				{display: inline-flex; padding-left: 30px; align-items: center}
ul.social-list li			{margin-left: 15px}
ul.social-list li a			{box-shadow: none; background-color: transparent;}
ul.social-list li a:after	{display: none}
ul.social-list li a:hover	{transform: none !important; opacity: 0.5}
ul.social-list li img		{width:30px;}

.footer-left		{width: 720px; max-width: 100%;}
.footer-left p		{color: #ffffff; font-size: 27px; margin-bottom: 0}
.footer-left p a	{color: #ffffff; text-decoration: none; transition: 0.3s ease-out;}
.footer-left p a:hover 	{opacity: 0.5}

.footer-middle			{display: inline-flex; margin-left: 70px;}
.footer-middle p		{font-size: 12px;}
.footer-middle ul		{font-size: 12px; font-family: 'Montserrat', sans-serif; line-height: 1.3em; padding-left: 30px;}
.footer-middle ul li	{margin-bottom: 5px;}
.footer-middle ul li a	{text-decoration: none}
.footer-middle ul li a:hover 	{opacity: 0.5}

.footer-right			{display: inline-flex; justify-content: flex-end; flex: 1}
.footer-right .logo		{width: 125px;}
.footer-right .logo:after	{display: none}

/* LEGACY COOKIE BAR */
.cookieBar              {width: 100%; background-color:rgba(0,0,0,0.5); position: fixed; bottom: 0px; left: 0px; text-align: center; padding: 10px 10px; z-index: 99999999;}
.cookieBar p			{color:#ffffff; font-size:14px; font-family:inherit; line-height:1.5em; text-align:center; display:inline-block;}
.cookieBar .acceptBtn   {background:#000; border:1px solid #DEDEDE; font-weight:bold; display:inline-block; margin-top:6px; margin-left:5px; font-family:inherit; font-size:12px; padding:5px 10px; text-decoration:none; color:#FFF; text-transform:uppercase; }



/* COLOURS */

.navy						{background-color: #102544; color: #ffffff}
.navy .btn span,
.navy h1 span				{color:#C2A336}
.navy .next-previous .btn,
.navy .next-previous .cols	{border-color:#C2A336}
.navy .hamburger span		{background-color: #C2A336}
.navy .hamburger:hover span	{background-color: #ffffff}

.navy .previous-btn .btn:hover,
.navy .next-previous .btn:hover				{color: #C2A336}
.navy .previous-previous .btn:hover path,
.navy .next-previous .btn:hover path		{fill:#C2A336}

.pink							{background-color: #FDDAE0; color: #000000}
.pink h1 span					{color:#707070}
.pink .next-previous .btn,
.pink .next-previous .cols		{border-color:#ffffff}
.pink .next-previous .btn 		{color: #000000}
.pink .portfolio-item			{color: #000000}
.pink .next-previous .btn path	{fill:#000000}
.pink header .logo				{filter: brightness(0)}
.pink .hamburger span			{background-color: #000000}

.pink .previous-btn .btn:hover,
.pink .next-previous .btn:hover				{color: #707070}
.pink .previous-previous .btn:hover path,
.pink .next-previous .btn:hover path		{fill:#707070}


.white							{background-color: #ffffff; color: #102544}
.white .btn span,
.white h1 span					{color:#C2A336}
.white .next-previous .btn,
.white .next-previous .cols		{border-color:#102544}
.white .next-previous .btn 		{color: #102544}
.white .portfolio-item			{color: #102544}
.white .next-previous .btn path	{fill:#102544}
.white header .logo				{filter: brightness(0)}
.white .hamburger span			{background-color: #102544}

.white .previous-btn .btn:hover,
.white .next-previous .btn:hover			{color: #C2A336}
.white .previous-previous .btn:hover path,
.white .next-previous .btn:hover path		{fill:#C2A336}


.gold							{background-color: #C2A336; color: #ffffff}
.gold .btn span,
.gold h1 span					{color:#000000}
.gold .next-previous .btn,
.gold .next-previous .cols		{border-color:#ffffff}
.gold .next-previous .btn 		{color: #ffffff}
.gold .portfolio-item			{color: #ffffff}
.gold .next-previous .btn path	{fill:#ffffff}
.gold header .logo				{filter: brightness(0)}
.gold .hamburger span			{background-color: #000000}
.gold .hamburger:hover span		{background-color: #ffffff}

.gold .previous-btn .btn:hover,
.gold .next-previous .btn:hover				{color: #000000}
.gold .previous-previous .btn:hover path,
.gold .next-previous .btn:hover path		{fill:#000000}




.light .hamburger:hover span,
.pink .hamburger:hover span,
.white .hamburger:hover span	{background-color: #C2A336}




/* REMOVE AUTOFILL BACKGROUND */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
	-webkit-box-shadow: 0 0 0 50px #ffffff inset !important;
	-webkit-text-fill-color: unset;
}
/* IE10+ SPECIFIC STYLES GO HERE. IE10+ NO LONGER SUPPORT CONDITIONAL STATEMENTS IN THE HEAD OF A FILE */ 
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {  

}

@media (max-width: 1300px) 
{
	/* FOOTER */
	.footer-left	{width: 50%;}
	.footer-left p	{font-size: 20px}
	
	.home-clients p	{font-size: 5vw}
	
	/* HOW WE WORK */
	.form-panel .form-left	{width: 50%}
	.form-right p	{font-size: 30px;}
}

@media (max-width: 1200px) 
{
	/* NEXT PREVIOUS */
	.btn p		{font-size: 5vw;}
	.btn svg	{width: 7vw;}
	
	/* FOOTER */
	.social-item	{width: 100%;}
	
	/* TESTIMONIALS */
	.testimonials-section cite	{font-size: 28px;}
}

@media (max-width: 1170px) 
{
    /* HEADER */
	.home header		{align-items: flex-end}
	.home header h1	{margin-left: 0; margin-bottom: 2px;}
	.homepage-hero .image-left		{width:100%;background:#fff;}
	.homepage-hero .image-right		{display:none;}
	.homepage-hero .iframe-container {margin-bottom:-10%;}
	
	/* FOOTER */
	.footer-main-nav ul li	{font-size: 3vw}
	.footer-left p			{font-size: 2vw}
	ul.social-list			{padding-left: 0}
	.footer-middle			{margin-left: 0}
	
	/* PORTFOLIO ITEM */
	.portfolio-item	{padding: 60px 30px;}
	.next-previous	{padding:0 30px 60px 30px;}
	.next-previous .cols	{padding: 20px 0}
	
	/* WHAT WE DO */
	.two-col-text-wwd					{padding: 60px 30px;}
	.two-col-text-wwd h2				{font-size: 6.5vw}
	.two-col-text-wwd p.intro			{font-size: 3vw}
	.two-col-text-wwd .col-left			{padding-left: 0}
	.two-col-text-wwd .cols				{align-items: flex-start;}
	.two-col-text-wwd .col-left img		{width: 20vw;}
	.two-col-text-wwd .col				{width: 50%; max-width: 50%; padding-right: 30px;}
	.two-col-text-wwd .col:last-child	{padding-right: 0px;}
	.two-col-text-wwd .col-right img	{width: 100%}
	.two-col-text-wwd.flipped .cols .col:first-child	{padding-right: 0; padding-left: 30px;}

	/* SCROLLY SECTION */
	.scrolly-container 	{transform: translateY(-18vw);}
	.scrolly-outer p	{font-size: 4vw;}
	.scrolly-inner		{width: 250vw}
	
	/* FOOTER */
	.footer-left p	{font-size: 18px}
}

@media (max-width: 1040px) 
{
	/* FOOTER */
	.footer-left p	{font-size: 16px;}
	.social-list li img	{width: 20px;}
	.footer-middle	{padding-left: 20px;}
}

@media (max-width: 960px) 
{
    /* HEADER */
	.home header .logo	{width: 17vw;}
	.home header h1		{font-size: 2.75vw}
	
	/* PORTFOLIO ITEM */
	.portfolio-intro h1					{font-size: 50px;}
	.portfolio-intro p					{font-size: 22px;}
	.portfolio-item .portfolio-col p	{font-size: 16px;}
	.stamp								{width: 150px;}
	
	/* TESTIMONIALS */
	.testimonials-section cite	{font-size: 24px;}
	
	/* HOW WE WORK */
	.how-we-work-page .two-col-text .col-left p.intro	{font-size: 24px;} 
	
	/* FORM */
	.form-section			{padding-top: 0}
	.form-panel				{padding: 8vw}
	.form-panel .cols		{flex-direction: column; justify-content: flex-start}
	.form-panel .form-left	{width: 100%; padding: 0; margin: 0}
	.form-panel .form-right	{width: 100%; padding: 0; margin:50px 0 70px;}
	.form-panel .download-circle			{transform: translate(-50%, 0);right: 0;left: 50%;}
	
	/* FOOTER */
	.footer-middle		{flex-direction: column}
	.footer-middle ul	{padding-left: 0}
	
}

@media (max-width: 900px) 
{
	/* FOOTER */
	.footer-contact-social	{flex-direction: column; align-items: flex-start;}
	ul.social-list			{margin-top: 10px;}
	ul.social-list li		{margin: 0 15px 0 0}
	.footer-left p			{font-size: 14px;}
}

@media (max-width: 768px) 
{
	/* HEADER */
	.home header					{padding: 30px;}
	.hamburger						{height: 26px; left: 30px;}
	.hamburger span					{height: 6px;}
	.hamburger span:nth-child(2)	{top:10px;}
	.hamburger span:nth-child(3)	{top:20px;}
	
	.home header .hamburger			{top: 30px;}
	
	.image-right	{display: none}
	
	/* TESTIMONIALS */
	.testimonials-section .cols		{flex-direction: column; align-items: center; justify-content: center}
	.testimonials-section .inner	{padding: 0; padding: 0 8vw}
	.testimonials-section .col		{width: 100%; max-width: 100%; padding: 0; margin:0 auto 35px;}
	.testimonials-section .col:last-child	{margin-bottom: 0}
	.testimonials-section h2		{padding:0;}
	.testimonials-section			{padding-top: 80px;}
	
	/* FORM SECTION */
	.form-panel .download-circle svg	{width: 220px;}
	.form-panel .download-circle		{width: 275px;}
	.form-section						{padding-bottom: 150px;}
	
	/* FOOTER */
	footer					{padding: 30px;}
	
}

@media (max-width: 700px) 
{
	/* PORTFOLIO ITEM */
	.portfolio-item .cols					{flex-direction: column !important; margin-bottom: 0}
	.portfolio-item .cols .portfolio-col	{width: 100%; margin-bottom: 50px;}
	.portfolio-item .cols:last-of-type .portfolio-col	{margin-bottom: 0}
	
	/* FOOTER */
	footer .cols				{flex-direction: column}
	ul.social-list				{margin: 15px 0 10px 0}
	.footer-left				{width: 100%}
	.footer-main-nav ul li a	{font-size: 40px;}
	.footer-middle				{padding-left: 0; margin-top: 10px;}
	
}

@media (max-width: 640px) 
{
	h2	{margin-bottom: 0.5em}
	
    /* TWO COL TEXT */
	.two-col-text			{padding: 60px 30px;}
	.two-col-text .cols		{flex-direction: column}
	.two-col-text .col		{width: 100%; max-width: 100%;}
	.two-col-text .col-left	{margin-bottom: 1.5em}
	
	/* HOME TEAM */
	.home-team	{height: auto; min-height: unset}
	
	/* HOME CLIENTS */
	.home-clients	{padding: 60px 30px;}
	.dk-only		{display: none}
	
	/* PORTFOLIO LISTING */		
	.portfolio-listing-section								{padding: 60px 30px;}
	.portfolio-listing-section .cols								{flex-direction: column}
	.portfolio-col.portrait .listing-image-container,
	.portfolio-col.first-portfolio-col .listing-image-container	{width: 70%;}
	
	.portfolio-col.landscape .listing-image-container			{width: 90%}
	
	.portfolio-col.first-portfolio-col,
	.portfolio-listing-intro-col								{width: 100%;}
	
	.portfolio-col		{margin-bottom: 50px;}
	
	/* WHAT WE DO */
	.two-col-text-wwd					{padding: 30px}
	.two-col-text-wwd .cols				{flex-direction:  column-reverse !important}
	.two-col-text-wwd .col-right img	{width: 100%; max-width: 100%;}
	.two-col-text-wwd .col-left			{padding: 40px 0 !important; padding-bottom: 0 !important; margin-bottom: 0; width: 300px; max-width: calc(100% - 30px); background-color: #000000; /*margin-top: -50px;*/ position: relative; z-index: 5}
	.two-col-text .col-right			{padding: 0 !important}
	.two-col-text-wwd .col-left img		{min-width: 150px; margin-bottom: 20px;}
	.two-col-text-wwd.flipped .col-left	{align-self: flex-end; text-align: right}
	
	.what-we-do .two-col-text:first-child .cols .col-left	{background-color: transparent; margin: 0; width: 100%; max-width: 100%; padding: 0 !important; margin-bottom: 20px;}
	.what-we-do .two-col-text:first-child .cols .col-right	{margin-bottom: 50px;}

	.two-col-text.two-col-text-ap .cols,
	.two-col-text.two-col-text-hww			{padding-top: 50px; padding-bottom: 50px;}
	
	.two-col-text.two-col-text-ap .cols,
	.two-col-text.two-col-text-hww .cols	{flex-direction: column-reverse !important; align-items: center}
	
	.two-col-text.two-col-text-ap .col-left,
	.two-col-text.two-col-text-hww .col-left	{text-align: center; background-color: transparent !important; margin: 0 auto}
	
	.two-col-text.two-col-text-ap .col-right,
	.two-col-text.two-col-text-hww .col-right	{display: flex; justify-content: center; align-items: center}
	
	.two-col-text.two-col-text-ap .col-right img,
	.two-col-text.two-col-text-hww .col-right img	{width: 200px !important; max-width: 100%}
	
	/* CONTACT */
	.contact-images						{padding: 60px 30px 0; align-items: flex-start}
	.contact-images img					{top:auto !important}
	.contact-images img:nth-child(2)	{margin-top: 100px}
	
	
	.work-with-us img	{width: 200px; margin-left: auto; margin-right: auto; display: block}
	
	/* TESTIMONIALS */
	.testimonials-section			{padding-top: 50px;}
	.testimonials-section .inner	{padding: 0 30px}

	/* HOW WE WORK */
	.how-we-work-page .two-col-text .col-right	{margin-top: 100px;}
	.how-we-work-page .circle					{width: 150px;}
	
	/* FORM SECTION */
	.form-panel			{padding-top:20px}
	.form-cell label	{padding: 0}
	.form-cell			{flex-direction: column; padding-bottom:0}
	.form-cell .text-box {padding-bottom:30px;padding-right:0;}
	.form-right p		{font-size: 24px;}
	.form-cell input[type='text']	{padding: 12px 0}
	.form-field-error				{top:70px;left:0;}
	.error-list p							{margin-left:0;}

	.form-row-textarea .text-box textarea		{padding: 0;}
	.form-row-textarea .text-box .form-field-error {top:125px;}
	
	/* FOOTER */
	.footer-main-nav ul li	{font-size: 20px;}
	ul.social-list			{margin-left: 0 !important}
	
}


@media (max-width: 500px) 
{
	.home header		{flex-direction: column-reverse; padding: 20px 30px;}
	.home header .logo	{margin-bottom: 10px; width: 110px;}
	nav ul				{font-size: 5vh}
	nav .close			{width: 40px;}
	nav ul li a			{font-size: 8.7vw;}
	
	.home header h1 	{font-size: 20px; text-align: right; line-height: 1.2em; width: 370px; max-width: 100%}
		
    /* TWO COL TEXT */
	.portfolio-intro h1,
	h2			{font-size: 50px;}
	
	.portfolio-intro p,
	p.intro		{font-size: 22px;}
	
	p			{font-size: 18px;}
	
	/* HOME CLIENTS */
	.home-clients	{padding-bottom: 30px; padding-top: 20px;}
	.home-clients p	{font-size: 30px;}
	
	/* FORM SECTION */
	.form-panel .download-circle		{width: 205px; right: 20px;}
	.form-panel .download-circle svg	{width: 150px;}
	
}

@media (max-width: 414px) 
{
    /* TWO COL TEXT */
	.two-col-text h2	{font-size: 40px;}
	p.intro				{font-size: 20px;}
	p					{font-size: 16px;}
}

@media (max-width: 375px) 
{
    /* IPHONE 6 */
}

@media (max-width: 360px) 
{
    /* SAMSUNG GALAXY S5 */
}

@media (max-width: 320px) 
{
    /* IPHONE 5 */
}