/*
 Theme Name:     Joe Walkling Child theme
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Child Theme
 Author:         Joe Walkling
 Author URI:     https://www.joewalkling.com
 Template:       Divi
 Version:        1.0.0
*/
 
/* ------------------------------------------------------------------------- */
/* -------------------- Theme customization starts here -------------------- */
/* ------------------------------------------------------------------------- */

:root {
	
	--black: #000000;
	--half-black: rgba(0,0,0,0.5);
	--quarter-black: rgba(0,0,0,0.25);
	--dark-grey: #1f1f1f;
	--white: #ffffff;
	--half-white: rgba(255,255,255,0.5);
	--quarter-white: rgba(255,255,255,0.25);
	
	--transparent: rgba(191, 189, 167, 0) !important;
	
	--orange: #ff4e00 ;
	--half-orange: rgba(255, 78, 0, .5);
	
	--yellow: #c4ff00 ;
	--half-yellow: rgba(196, 255, 0, .5);
	
	--rust: #a24122 ;
	--half-rust: rgba(162, 65, 34, .5);
	
	--green: #0c2f10 ; 
	--half-green: rgba(12, 47, 16, .5);
	
	--blue: #3462f9 ;
	--half-blue: rgba(52, 98, 249, .5);
	
	--stone: #bfbda7 ;
	--half-stone: rgba(191, 189, 167, .5);
	
	--grey: #888888 ;
	--half-grey: rgba(136, 136, 136, .5);
	
	--burgundy: #4a0d12 ;
	--half-burgundy: rgba(74, 13, 18, .5);
	
	--denim: #12556f ;
	--half-denim: rgba(18, 85, 111, .5) ;

	--red: #ff3000;
	--pink: #ff4097;
	
	--trans-500: all 500ms ease 0s;
	--trans-500delay: all 500ms ease 1s;
	--trans-300: all 300ms ease 0s;
	--trans-title-close: top 2s cubic-bezier(.36,0,.3,1) 0s, bottom 2s cubic-bezier(.36,0,.3,1) 0s, background 750ms ease-in-out 2000ms ;
	--trans-title-open: top 1s cubic-bezier(.36,0,.3,1) 500ms, bottom 1s cubic-bezier(.36,0,.3,1) 500ms, background 500ms ease-in-out 0ms ;
	--trans-slow: all 2s cubic-bezier(.36,0,.3,1) 0s;
	--trans-med: all 1s cubic-bezier(.36,0,.3,1) 0s;
	--trans-fast: all 500ms cubic-bezier(.36,0,.3,1) 0s;
	
	--port-trans-slow: transform 1.2s cubic-bezier(.36,0,.3,1) 0s;

	--letter-trans: cubic-bezier(.36,0,.3,1);
	--opacity-delay: opacity 500ms ease-in-out 3000ms;
	
	--font-del-reg: 'del-reg', helvetica, arial, sans-serif !important;
	
	--font-xs: 14px !important;
	--font-s: clamp(20px , 2vw , 30px) !important;
	--font-sm:  clamp(30px , 3vw , 60px) !important;
	--font-m:  clamp(30px , 5vw , 100px) !important;
	
	--delphinegaborit: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/delphine-site-title.svg');
	
	--del-g: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/g.svg');
	--del-a: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/a.svg');
	--del-b: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/b.svg');
	--del-o: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/o.svg');
	--del-r: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/r.svg');
	--del-i: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/i.svg');
	--del-t: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/t.svg');
	--del-d: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/d.svg');
	--del-e: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/e.svg');
	--del-l: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/l.svg');
	--del-p: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/p.svg');
	--del-h: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/h.svg');
	--del-n: url('http://4x5.456.myftpupload.com/wp-content/themes/divi-child/resources/n.svg');
	
	--arrow-right: url('http://delphinegaborit.com/wp-content/themes/divi-child/resources/arrow-right.svg') ;
	--arrow-left: url('http://delphinegaborit.com/wp-content/themes/divi-child/resources/arrow-left.svg') ;
	--arrow-down: url('http://delphinegaborit.com/wp-content/themes/divi-child/resources/arrow-down.svg') ;
	
	--right-arrow-png: url('http://delphinegaborit.com/wp-content/themes/divi-child/resources/right-arrow.png');
	--left-arrow-png: url('http://delphinegaborit.com/wp-content/themes/divi-child/resources/left-arrow.png');

}

::selection{
	color: var(--blue);
	background:  var(--yellow);
}



/* ------------------------------------------------------------------------- */
/* TYPOGRAPHY */
/* ------------------------------------------------------------------------- */

@font-face {
  font-family: 'del-reg';
  src: url('fonts/Kobe-Regular.eot'); /* IE9 compat modes */
  src: url('fonts/Kobe-Regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/Kobe-Regular.woff') format('woff'); /* Pretty Modern Browsers */
}




/* ---------- TYPOGRAPHY */

h1, h2, h3, h4, h5, h6, h7{
	font-family: var(--font-del-reg);
	font-weight: normal;
	font-style: normal;
	line-height: .75em;
	text-transform: uppercase;
}

body, p{
	font-family: var(--font-del-reg);
	font-weight: normal;
	font-style: normal;
	line-height: 1em;
	font-size: var(--font-s);
}

strong, b{
	font-weight: bold;
	font-style: normal;
}
em, i{
	font-weight: normal;
	font-style: italic;
}

.feattext h1{
	font-size: clamp(40px , 6vw , 120px) !important;
}
.feattext h2{
	font-size: clamp(30px , 4.5vw , 90px) !important;
}
.feattext p{
	font-size: var(--font-sm) !important;
}


/* ------------------------------------------------------------------------- */
/* HEADER */
/* ------------------------------------------------------------------------- */

/* ----- header section */
.del-hdr-sec{
	position:fixed;
	top: 50%;
	left: 0;
	right: 0;
	width: 100% !important;
	max-width: 100% !important;
	height: 0px !important;
	z-index: 999999 !important;
}

/* slide in top/bottom click*/
#slide-in-open-top *{
	line-height: 0em !important;
}
#slide-in-open-top{
	cursor: pointer;
	padding: 15px 0px !important;
	width: 100% !important;
}
#slide-in-open-top .del-1{
	content: var(--delphinegaborit);
	width: 100%;
	height: auto;
	max-height: 3.5vw;
}
/* slide in containers */
.slide-in-menu-top, .slide-in-menu-bottom{
	position: fixed;
	left: 0;
	right: 0;
	padding: 0px 3vw !important;
	height: calc(50vh + 1px);
	background: var(--transparent);
	-webkit-transition: var(--trans-title-close) !important;
	-moz-transition: var(--trans-title-close) !important;
	-o-transition: var(--trans-title-close) !important;
	-ms-transition: var(--trans-title-close) !important;
	transition: var(--trans-title-close) !important;
	z-index: 2;
	overflow: hidden !important;
}
.slide-in-top, .slide-in-bottom{
	background: var(--rust);
	-webkit-transition: var(--trans-title-open) !important;
	-moz-transition: var(--trans-title-open) !important;
	-o-transition: var(--trans-title-open) !important;
	-ms-transition: var(--trans-title-open) !important;
	transition: var(--trans-title-open) !important;
}

/* slide in bottom container */
.slide-in-menu-bottom .et_pb_column{
	display: grid;
	grid-template: auto / 4fr 1fr 1fr;
	grid-gap: 0px;
	grid-template-areas: 
		'filters about contact'
		;
	padding: 0px !important;
	align-items: baseline;
}
/* --- menu items */
.slide-in-menu-bottom .menu-item{
	transform: translateY(0) scale(100%);
	-webkit-transition: var(--trans-fast) !important;
	-moz-transition: var(--trans-fast) !important;
	-o-transition: var(--trans-fast) !important;
	-ms-transition: var(--trans-fast) !important;
	transition: var(--trans-fast) !important;
}
.slide-in-menu-bottom .about{
	grid-area: about;
}
.slide-in-menu-bottom .contact{
	grid-area: contact;
}
.slide-in-menu-bottom .jwd-filter{
	grid-area: filters;
	transform: translateY(0);
	-webkit-transition: var(--trans-fast) !important;
	-moz-transition: var(--trans-fast) !important;
	-o-transition: var(--trans-fast) !important;
	-ms-transition: var(--trans-fast) !important;
	transition: var(--trans-fast) !important;
}
.slide-in-menu-bottom .jwd-filter .sf-field-category ul{
	display: grid;
	grid-template: auto / repeat(4 , 1fr);
	grid-gap: 0px;
	grid-template-areas: 
		'fashion art film theatre'
		;
	padding: 0px ;
}
/* filter items */
/* all items */
.jwd-filter input{
		display: none !important
	}
.jwd-filter label{
    font-family: var(--font-del-reg);
    font-weight: normal;
    font-style: normal;
    line-height: 1em;
    font-size: var(--font-s);
	text-transform: uppercase;
	cursor: pointer !important;
	padding: 0px !important;
}
.jwd-filter .sf-level-0{
	padding: 15px ;
	text-align: center;
	-webkit-transition: var(--trans-fast) !important;
	-moz-transition: var(--trans-fast) !important;
	-o-transition: var(--trans-fast) !important;
	-ms-transition: var(--trans-fast) !important;
	transition: var(--trans-fast) !important;
}
.jwd-filter ul{
	padding: 0px;
}
.jwd-filter ul li{
	padding: 0px;
}

/* all portfolio */.jwd-filter .sf-item-0{
	display: none !important;
}
/* fashion */.jwd-filter .sf-item-18{
	grid-area: fashion;
}
/* art */.jwd-filter .sf-item-19{
	grid-area: art;
}
/* film */.jwd-filter .sf-item-20{
	grid-area: film;
}
/* theatre */.jwd-filter .sf-item-21{
	grid-area: theatre;
}
/* movement-choreography */
.movement-choreography {
	grid-column: 1 / span all;
	opacity: 1;
	transform: translateY(-200%) ;
	word-spacing: 5em !important;
	cursor: pointer !important;
	font-size: var(--font-s) !important;
	-webkit-transition: var(--trans-fast) !important;
	-moz-transition: var(--trans-fast) !important;
	-o-transition: var(--trans-fast) !important;
	-ms-transition: var(--trans-fast) !important;
	transition: var(--trans-fast) !important;
}
.slide-in-bottom .movement-choreography{
	opacity: 1;
	transform: translateY(-100%) ;
}

/* ----- slide in actions */
.slide-in-menu-top{
	top: calc(-50vh + 3.5vw + 30px);
	bottom: auto;
}
.slide-in-menu-top.slide-in-top{
	top: 0px;
	bottom: auto;
}
.slide-in-menu-top .et_pb_column{
	display: flex;
    flex-direction: column;
    justify-content: flex-end;
    height: 100%;
	align-items: center;
}
.slide-in-menu-bottom{
	top: auto;
	bottom: calc(-50vh + 57px);
}
.slide-in-menu-bottom.slide-in-bottom{
	top: auto;
	bottom: 0;
}

/* on homepage only (not mobile) */
@media only screen and (min-width:601px){
	.page-id-44 .slide-in-menu-top{
		top: 0;
		bottom: auto;
	}
	.page-id-44 .slide-in-menu-top.slide-in-top{
		top: calc(-50vh + 3.5vw + 30px);
		bottom: auto;
	}
	.page-id-44 .slide-in-menu-bottom{
		top: auto;
		bottom: 0;
	}
	.page-id-44 .slide-in-menu-bottom.slide-in-bottom{
		top: auto;
		bottom: calc(-50vh + 57px);
	}
	/* strapline and menu items */
	.page-id-44 .movement-choreography {
		transform: translateY(-100%) ;
	}
	.page-id-44 .slide-in-bottom .movement-choreography{
		transform: translateY(-200%) ;
	}
	.page-id-44 .slide-in-menu-bottom .jwd-filter{
		transform: translateY(-200%);	
	}
	.page-id-44 .slide-in-bottom .jwd-filter {
    	transform: translateY(0);
	}
	.page-id-44 .slide-in-menu-bottom .menu-item{
		transform: translateY(-200%) scale(100%);
	}
	.page-id-44 .slide-in-bottom .menu-item {
    	transform: translateY(0) scale(100%);
	}
	/* slide in containers */
	.page-id-44 .slide-in-menu-top, .page-id-44 .slide-in-menu-bottom{
		background: var(--rust);
		-webkit-transition: var(--trans-title-open) !important;
		-moz-transition: var(--trans-title-open) !important;
		-o-transition: var(--trans-title-open) !important;
		-ms-transition: var(--trans-title-open) !important;
		transition: var(--trans-title-open) !important;
	}
	.page-id-44 .slide-in-top, .page-id-44 .slide-in-bottom{
		background: var(--transparent);
		-webkit-transition: var(--trans-title-close) !important;
		-moz-transition: var(--trans-title-close) !important;
		-o-transition: var(--trans-title-close) !important;
		-ms-transition: var(--trans-title-close) !important;
		transition: var(--trans-title-close) !important;
	}
}
@media only screen and (min-width:981px){
	/* ---- filters and menu items on hover */
	.jwd-filter li.sf-level-0:hover, .slide-in-menu-bottom .menu-item:hover{
		transform: scale(110%);
	}	
}
/* ------------------------------------------------------------------------- */
/* FEATURED ANIMATION */
/* ------------------------------------------------------------------------- */
.del-animation-sec{
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	pointer-events: none !important;
}
.del-animation-row .et_pb_column{
	height: 100vh !important;
}
.letter{
	display: block;
	height: auto;
	position: absolute;
	mix-blend-mode: overlay;
	-webkit-transition: var(--trans-slow) !important;
	-moz-transition: var(--trans-slow) !important;
	-o-transition: var(--trans-slow) !important;
	-ms-transition: var(--trans-slow) !important;
	transition: var(--trans-slow) !important;
}
.letter-d{ 
	content: var(--del-d);
	min-width: 300px;
	width: 40vw;
	transform: rotate(0deg);
	top:-10vh;
	left: -4vw;
}
.letter-e{
	content: var(--del-e);
	min-width: 157px;
	width: 21vw;
    transform: rotate(-30deg);
    top: 40vh;
    left: 7vw;
}
.letter-l{
	content: var(--del-l);
	min-width: 60px;
	width: 8vw;
    transform: rotate(24deg);
    top: 16vh;
    left: 27vw;
}
.letter-p{
	content: var(--del-p);
	min-width: 157px;
	width: 21vw;
    transform: rotate(-44deg);
   	top: 63vh;
    left: 0vw;
}
.letter-h{
	content: var(--del-h);
	min-width: 307px;
	width: 41vw;
    transform: rotate(24deg);
    bottom: -30vh;
    left: 16vw;
}
.letter-i{
	content: var(--del-i);
	min-width: 127px;
	width: 17vw;
    transform: rotate(0deg);
    top: 43vh;
    left: 51vw;
}
.letter-n{
	content: var(--del-n);
	min-width: 150px;
	width: 20vw;
    transform: rotate(4deg);
    bottom: 3vh;
    right: 21vw;
}
.letter-e2{
	content: var(--del-e);
	min-width: 195px;
	width: 26vw;
    transform: rotate(36deg);
    bottom: 0vh;
    right: 0vw;
}

/* moving letters */
/* all letters */
.letter-d, .letter-e, .letter-l, .letter-p, .letter-h, .letter-i, .letter-n, .letter-e2 {
	animation-iteration-count: 1;
}

/* on about page */
.page-id-48 .letter{
	animation-timing-function: var(--letter-trans);
}
/* hide letters on scroll */
.page-id-48 .hide-letters .letter{
	opacity: 0 !important;
	transform: translateY(-100%);
}
.page-id-48 .letter-d {
	animation-name: d-move-about;
	animation-duration: 5500ms;
}
.page-id-48 .letter-e {
	animation-name: e-move-about;
	animation-duration: 3750ms;
}
.page-id-48 .letter-l {
	animation-name: l-move-about;
	animation-duration: 3500ms;
}
.page-id-48 .letter-p {
	animation-name: p-move-about;
	animation-duration: 3900ms;
}
.page-id-48 .letter-h {
	animation-name: h-move-about;
	animation-duration: 3500ms ;
}
.page-id-48 .letter-i {
	animation-name: i-move-about ;
	animation-duration: 4500ms;
}
.page-id-48 .letter-n {
	animation-name: n-move-about;
	animation-duration: 5500ms;
}
.page-id-48 .letter-e2 {
	animation-name: e2-move-about ;
	animation-duration: 5750ms;
}

@keyframes d-move-about {
	0% { top: -100%; left: 10vw; width: 5vw; transform: rotate(36deg); }
	100%{ top: -10vh; left: -4vw; width: 40vw; transform: rotate(0deg); }
}
@keyframes e-move-about {
	0% { width: 6vw; transform: rotate(600deg); top: -40vh; left: 7vw; }
	100%{ width: 21vw; transform: rotate(-30deg); top: 40vh; left: 7vw; }
}
@keyframes l-move-about{
	0%{ width: 35vw; transform: rotate(-24deg); top: -220vh; left: -10vw; }
	100%{ width: 8vw; transform: rotate(24deg); top: 16vh; left: 27vw; }
}
@keyframes p-move-about{
	0%{ width: 12vw; transform: rotate(-744deg); top: -25vh; }
	100%{ width: 21vw; transform: rotate(-44deg); top: 63vh; }
}
@keyframes h-move-about{
	0%{ width: 4vw; transform: rotate(524deg); bottom: 130vh; left: -16vw; }
	100%{ width: 41vw; transform: rotate(24deg); bottom: -30vh; left: 16vw; }
}
@keyframes i-move-about{
	0% { width: 7vw; transform: rotate(-430deg); top: -50vh; left: 0vw; }
	100%{ width: 17vw; transform: rotate(0deg); top: 43vh; left: 51vw; }
}
@keyframes n-move-about {
	0%  { width: 8vw; transform: rotate(-344deg); bottom: 100vh; right: 100vw; }
	100%  { width: 20vw; transform: rotate(4deg); bottom: 3vh; right: 21vw; }
}
@keyframes e2-move-about {
	0%  { width: 26vw; transform: rotate(-360deg); bottom: 100vh; right: 100vw; }
	100%  { width: 26vw; transform: rotate(36deg); bottom: 0vh; right: 0vw; }
}

/* letters on homepage (reverse) */
.page-id-44 .letter{
	animation-timing-function: var(--letter-trans);
	transition: var(--opacity-delay) !important;
}
/* hide letters on scroll */
.page-id-44 .hide-letters .letter{
	opacity: 0 !important;	
}
.page-id-44 .hide-letters .letter-d {
	animation-name: d-move-home;
	animation-duration: 5500ms;
}
.page-id-44 .hide-letters .letter-e {
	animation-name: e-move-home;
	animation-duration: 3750ms;
}
.page-id-44 .hide-letters .letter-l {
	animation-name: l-move-home;
	animation-duration: 3500ms;
}
.page-id-44 .hide-letters .letter-p {
	animation-name: p-move-home;
	animation-duration: 3900ms;
}
.page-id-44 .hide-letters .letter-h {
	animation-name: h-move-home;
	animation-duration: 3500ms ;
}
.page-id-44 .hide-letters .letter-i {
	animation-name: i-move-home ;
	animation-duration: 4500ms;
}
.page-id-44 .hide-letters .letter-n {
	animation-name: n-move-home;
	animation-duration: 5500ms;
}
.page-id-44 .hide-letters .letter-e2 {
	animation-name: e2-move-home ;
	animation-duration: 5750ms;
}

@keyframes d-move-home {
	0%{ top: -10vh; left: -4vw; width: 40vw; transform: rotate(0deg); }
	100% { top: -100%; left: 10vw; width: 5vw; transform: rotate(36deg); }
}
@keyframes e-move-home {
	0%{ width: 21vw; transform: rotate(-30deg); top: 40vh; left: 7vw; }
	100% { width: 6vw; transform: rotate(600deg); top: -40vh; left: 7vw; }
}
@keyframes l-move-home{
	0%{ width: 8vw; transform: rotate(24deg); top: 16vh; left: 27vw; }
	100%{ width: 35vw; transform: rotate(-24deg); top: -220vh; left: -10vw; }
}
@keyframes p-move-home{
	0%{ width: 21vw; transform: rotate(-44deg); top: 63vh; }
	100%{ width: 12vw; transform: rotate(-744deg); top: -25vh; }
}
@keyframes h-move-home{
	0%{ width: 41vw; transform: rotate(24deg); bottom: -30vh; left: 16vw; }
	100%{ width: 4vw; transform: rotate(524deg); bottom: 130vh; left: -16vw; }
}
@keyframes i-move-home{
	0%{ width: 17vw; transform: rotate(0deg); top: 43vh; left: 51vw; }
	100% { width: 7vw; transform: rotate(-430deg); top: -50vh; left: 0vw; }
}
@keyframes n-move-home {
	0%  { width: 20vw; transform: rotate(4deg); bottom: 3vh; right: 21vw; }
	100%  { width: 8vw; transform: rotate(344deg); bottom: 100vh; right: 100vw; }
}
@keyframes e2-move-home {
	0%  { width: 26vw; transform: rotate(36deg); bottom: 0vh; right: 0vw; }
	100%  { width: 26vw; transform: rotate(-360deg); bottom: 100vh; right: 100vw; }
}

/* ------------------------------------------------------------------------- */
/* BODY */
/* ------------------------------------------------------------------------- */

/* ----- Padding and Margins */
.secpad:first-of-type		{	padding: 80px 0px !important;}
.secpad		{	padding: 80px 0px !important;}
.pad15		{	padding: 15px;}
.mar15		{	margin: 15px;}
.btnmar15	{	margin: 0px 15px;}
.flexsec	{	display: flex; flex-direction: column;}


/* flex vertical align */
.jw-flex-center	{display:flex;flex-direction: column;justify-content:center;}
.jw-flex-end	{display:flex;flex-direction: column;justify-content:flex-end;}
.jw-flex-start	{display:flex;flex-direction: column;justify-content:flex-start;}

.et_pb_column .et_pb_module{
	margin-bottom: 0px ;
}

/* ------------------------------------------------------------------------- */
/* HOME */
/* ------------------------------------------------------------------------- */
/* scroll  down text */
.del-scroll-row{
	display: block;
	position: fixed;
	top: 50%;
	transform: translate(-50%, -50%);
	left: 50%;
	opacity: 1;
	-webkit-transition: var(--trans-slow) !important;
	-moz-transition: var(--trans-slow) !important;
	-o-transition: var(--trans-slow) !important;
	-ms-transition: var(--trans-slow) !important;
	transition: var(--trans-slow) !important;
}
.del-scroll{
	background: var(--transparent);
	min-width: 75px;
    width: 8vw;
	max-width: 160px;
	min-height: 75px;
    height: 8vw;
	max-height: 160px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin: auto;
}
.del-scroll p{
	font-size: var(--font-m)!important;
}
.del-scroll .et_pb_code_inner{
	height: 100%;
	width: 100%;
}
.del-scroll-inner{
	content: var(--arrow-down);
}
/* hide on scroll */
.hide-arrow .del-scroll-row{
	opacity: 0;
	top: 49%;
}

/* ------------------------------------------------------------------------- */
/* ABOUT */
/* ------------------------------------------------------------------------- */
.page-id-48{
	background-color: var(--stone) !important;
}
.page-id-48 .del-animation-sec{
	background-color: var(--transparent) !important;
}
/* slide in containers */
.page-id-48 .slide-in-top, .page-id-48 .slide-in-bottom{
	background: var(--stone) !important;
}
/* animation section */
.page-id-48 .del-animation-sec{
	z-index: 9 !important;
}

/* biogrphay and images */
.del-bio-row .et_pb_column{
	display: grid;
	grid-template: auto / 1fr 4fr 1fr;
	grid-template-areas: 
		'image1 text1 .'
		'image2 text2 image3'
		'image2 text3 image3'
		;
	grid-gap: 15px;
}
.del-bio-img{
	height: fit-content;
}
.del-bio-img-1{
	grid-area: image1;
	margin: 10vh 0 0 0 !important;
}
.del-bio-img-2{
	grid-area: image2;
	margin: 20vh 0 0 -3vw !important;
}
.del-bio-img-3{
	grid-area: image3;
	margin: 0vh 0 0 0 !important;
}
.del-bio-txt-1{
	grid-area: text1;
}
.del-bio-txt-2{
	grid-area: text2;
}
.del-bio-txt-3{
	grid-area: text3;
}


/* ------------------------------------------------------------------------- */
/* CONTACT */
/* ------------------------------------------------------------------------- */
/* slide in containers */
.page-id-46 .slide-in-top, .page-id-46 .slide-in-bottom{
	background: var(--green) !important;
}

/* ------------------------------------------------------------------------- */
/* PORTFOLIO */
/* ------------------------------------------------------------------------- */

/* slide in containers */
.page-id-342 .slide-in-top, .page-id-342 .slide-in-bottom{
	background: var(--rust) !important;
}

/* Portfolio Grid */
.jwd-portfolio .et_pb_ajax_pagination_container{
	display: grid;
	grid-template: auto / 1fr 1fr;
	grid-gap: 0px;
}
/* post item */
.jwd-portfolio .et_pb_post{
	overflow: hidden !important;
	padding: 1vw !important;
	margin-bottom: 0px !important;
	-webkit-transition: var(--trans-med) !important;
	-moz-transition: var(--trans-med) !important;
	-o-transition: var(--trans-med) !important;
	-ms-transition: var(--trans-med) !important;
	transition: var(--trans-med) !important;
}
/* featured image ratio */
.jwd-portfolio .entry-featured-image-url{
	position: relative;
	padding-top: 100%;
	display: block;
	margin: 0px !important;
}
.jwd-portfolio .entry-featured-image-url img{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

/* portfolio Content */
.jwd-portfolio .post-content{
	position: absolute;
	top: auto;
	bottom: -100%;
	left: 0;
	right: 0;
	width: 100%;
	z-index: 999999 !important;
	padding: 0px;
	text-transform: uppercase;
	pointer-events: none !important;
	-webkit-transition: var(--trans-med) !important;
	-moz-transition: var(--trans-med) !important;
	-o-transition: var(--trans-med) !important;
	-ms-transition: var(--trans-med) !important;
	transition: var(--trans-med) !important;
}
.jwd-portfolio .et_pb_post:nth-child(odd) .post-content{
	text-align: right ;
}
.jwd-portfolio .et_pb_post:nth-child(even) .post-content{
	text-align: left ;
}

/* portfolio title */
.jwd-portfolio .entry-title{
	display: none !important;
}
.jwd-portfolio .portfolio-title{
	font-size: var(--font-m);
	word-spacing: 100em;
	line-height: .9em;
}
/* portfolio credits */
.jwd-portfolio .portfolio-credits{
	font-size: var(--font-s);
	line-height: 1em;
}

@media only screen and (min-width: 769px){
	/* on hover */
	.jwd-portfolio .et_pb_post:hover .post-content{
		bottom: 0;
	}
	/* --- on hover */
	.jwd-portfolio .et_pb_post:hover .entry-featured-image-url{
		opacity: .7;
	}
}
@media only screen and (max-width: 768px){
	.jwd-portfolio .post-content{
		display: none !important;
	}
}


/* ------------------------------------------------------------------------- */
/* Project Template */
/* ------------------------------------------------------------------------- */

/* ----- coloured backgrounds */
.rust .secpad, .rust .mfp-bg, .rust .project-ftr-nav, .rust .post-template-ftr-navigation .dp_oc_item:hover:after, .rust .slide-in-top, .rust .slide-in-bottom{
	background-color: var(--rust) !important;	
}
.rust .et_pb_video_overlay_hover:hover{
	background-color: var(--half-rust) !important;
}

.blue .secpad, .blue .mfp-bg, .blue .project-ftr-nav, .blue .post-template-ftr-navigation .dp_oc_item:hover:after, .blue .slide-in-top, .blue .slide-in-bottom{
	background-color: var(--blue) !important;	
}
.blue .et_pb_video_overlay_hover:hover{
	background-color: var(--half-blue) !important;
}

.stone .secpad, .stone .mfp-bg, .stone .project-ftr-nav, .stone .post-template-ftr-navigation .dp_oc_item:hover:after, .stone .slide-in-top, .stone .slide-in-bottom{
	background-color: var(--stone) !important;	
}
.stone .et_pb_video_overlay_hover:hover{
	background-color: var(--half-stone) !important;
}

.green .secpad, .green .mfp-bg, .green .project-ftr-nav, .green .post-template-ftr-navigation .dp_oc_item:hover:after, .green .slide-in-top, .green .slide-in-bottom{
	background-color: var(--green) !important;	
}
.green .et_pb_video_overlay_hover:hover{
	background-color: var(--half-green) !important;
}

.orange .secpad, .orange .mfp-bg, .orange .project-ftr-nav, .orange .post-template-ftr-navigation .dp_oc_item:hover:after, .orange .slide-in-top, .orange .slide-in-bottom{
	background-color: var(--orange) !important;	
}
.orange .et_pb_video_overlay_hover:hover{
	background-color: var(--half-orange) !important;
}

.grey .secpad, .grey .mfp-bg, .grey .project-ftr-nav, .grey .post-template-ftr-navigation .dp_oc_item:hover:after, .grey .slide-in-top, .grey .slide-in-bottom{
	background-color: var(--grey) !important;	
}
.grey .et_pb_video_overlay_hover:hover{
	background-color: var(--half-grey) !important;
}

.black .secpad, .black .mfp-bg, .black .project-ftr-nav, .black .post-template-ftr-navigation .dp_oc_item:hover:after, .black .slide-in-top, .black .slide-in-bottom{
	background-color: var(--black) !important;	
}
.black .et_pb_video_overlay_hover:hover{
	background-color: var(--half-black) !important;
}

.burgundy .secpad, .burgundy .mfp-bg, .burgundy .project-ftr-nav, .burgundy .post-template-ftr-navigation .dp_oc_item:hover:after, .burgundy .slide-in-top, .burgundy .slide-in-bottom{
	background-color: var(--burgundy) !important;	
}
.burgundy .et_pb_video_overlay_hover:hover{
	background-color: var(--half-burgundy) !important;
}
.denim .secpad, .denim .mfp-bg, .denim .project-ftr-nav, .denim .post-template-ftr-navigation .dp_oc_item:hover:after, .denim .slide-in-top, .denim .slide-in-bottom{
	background-color: var(--denim) !important;	
}
.denim .et_pb_video_overlay_hover:hover{
	background-color: var(--half-denim) !important;
}
/* ----- credits */
.post-template-sec .portfolio-title h1{
	font-size: var(--font-m) !important;
	word-spacing: 100em;
	line-height: .9em;
	padding-bottom: 0px !important;
}
.post-template-sec .portfolio-role h2, .post-template-sec .portfolio-role{
	font-size: var(--font-s);
	line-height: 1em;
	text-transform: uppercase;
}
.post-template-sec .portfolio-credits {
	font-size: var(--font-sm);
	line-height: 1em;
	text-transform: uppercase;
}

/* fullscreen video */
.video-sec{
	overflow: hidden !important;
}
.del-video .et_pb_code_inner{
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 100vh;
}
.del-video .fluid-width-video-wrapper{
    height: 100% !important;
    position: absolute !important;
    width: 1000% !important;
	padding: 0px 0px 57% 0px!important;
}

/* single embed video */
.del-video-2 .et_pb_video_play:before{
	font-family: var(--font-del-reg);
	content: var(--arrow-right) !important; 
	display: block;
	height: 55%;
	width: 51%;
}
.del-video-2 .et_pb_video_play {
    color: var(--yellow) !important;
    font-size: var(--font-m) !important;
    line-height: 1em !important;
    margin: 0 !important;
    height: 12vw;
    width: 12vw;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    border: 2px solid var(--yellow);
}

/* single images */
.del-single-image{
	height: calc(100vh - 200px) !important;
	overflow: hidden !important;
}

/* ----- Image carousel */
.project-carousel-row{
	width: 100% !important;
	padding-left: 11vw !important;
}
#project-carousel .owl-carousel .owl-stage-outer{
	height: fit-content;
}
#project-carousel .dp_oc_item {
	padding-top: 100%;
	display: block;
	transition: var(--trans-300);
}
@media only screen and (min-width: 768px){
	#project-carousel .dp_oc_item:hover{
		transform: scale(95%);
	}	
}
#project-carousel .dp_oc_item img {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	object-fit: contain;
}

/* arrows transition */
#project-carousel .owl-nav:before, #project-carousel .owl-next, #project-carousel .owl-prev{
	-webkit-transition: var(--trans-fast) !important;
	-moz-transition: var(--trans-fast) !important;
	-o-transition: var(--trans-fast) !important;
	-ms-transition: var(--trans-fast) !important;
	transition: var(--trans-fast) !important;
}
/* arrows container */
#project-carousel .owl-nav{
	position: absolute;
	top: 50%;
	left: -8vw;
	transform: translateY(-50%);
	display: flex;
	flex-flow: row nowrap;
	height: auto;
	width: auto;
	margin: 0px !important;
}
#project-carousel .owl-nav:before{
	content: '';
	height: 5px ;
	background: var(--yellow);
	width: calc(100% - 10px);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50% , -50%);
	display: block;
}
/* arrows */
#project-carousel .owl-next:before{
	content: var(--arrow-right) !important;
	display: block;
}
#project-carousel .owl-prev:before{
	content: var(--arrow-left)  !important;
	display: block;
}
#project-carousel .owl-next, #project-carousel .owl-prev{
    min-width: 60px;
    width: 6vw;
    max-width: 300px;
    margin: 0px !important;
    opacity: 1;
    transition: all 300ms ease 0s;
    left: 0;
    position: relative;
    height: 100%;
    display: block;
    margin: 0px !important;
    top: 0px !important;
    transform: none ;
}

@media only screen and (min-width: 768px){
	#project-carousel .owl-nav:hover:before{
		width: calc(100% + 20px);
	}
	#project-carousel .owl-nav:hover .owl-prev {
		transform: translateX(-15px);
	}
	#project-carousel .owl-nav:hover .owl-next {
		transform: translateX(15px);
	}
}

/* Lightbox images */
.mfp-bg{
	opacity: 1 !important;
}
.mfp-figure:after{
	display: none !important;
}
.mfp-img{
	max-height: calc(100vh - 2vw) !important;
	max-width: 94vw !important;
	padding: 0px !important;
}
.mfp-close{
	opacity: 1 !important;
	position: fixed !important;
	font-size: clamp(70px, 12vw, 200px) !important;
	right: 1vw !important;
	top: 0vw !important;
	color: var(--yellow) !important;
	cursor: pointer !important;
	padding: 0px !important;
	display: block !important;
    height: auto !important;
    line-height: .6em !important;
}
.mfp-bottom-bar{
	position: fixed;
	top: auto;
	bottom: 0;
	left: 0;
	right: 0;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	align-items: center;
	padding: 1vw;
	height: fit-content;
}
.mfp-bottom-bar *{
	position: relative !important;
	color: var(--yellow) !important;
	font-size: 24px !important;
}
.mfp-counter{
	text-transform: uppercase !important;
}

/* lightbox arrows */
.mfp-arrow {
	width: 49.65vw !important;
	height: calc(100vh - 200px) !important;
	transform: translateY(-50%) !important;
	top: 50% !important;
	margin: 0px !important;
}
.mfp-arrow:after{
	content: '' !important;
}
.mfp-arrow-left{
	cursor: var(--left-arrow-png)  0 0, pointer !important;
}
.mfp-arrow-right{
	cursor: var(--right-arrow-png) 0 0, pointer !important;
}

/* posts footer navigation */
.post-template-ftr-navigation .owl-carousel .owl-stage-outer{
	height: fit-content;
}
.post-template-ftr-navigation .dp_oc_item *, .post-template-ftr-navigation .dp_oc_item:after{
	-webkit-transition: var(--trans-fast) !important;
	-moz-transition: var(--trans-fast) !important;
	-o-transition: var(--trans-fast) !important;
	-ms-transition: var(--trans-fast) !important;
	transition: var(--trans-fast) !important;
}
.post-template-ftr-navigation .dp_oc_item {
	padding-top: 160%;
	display: block;
	transition: var(--trans-300);
	margin-bottom: 0px !important;
	position: relative;
}
.post-template-ftr-navigation .dp_oc_item img {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	object-fit: contain;
}

.post-template-ftr-navigation .dp_oc_post_title{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50% , -50%);
	width: auto;
	height: auto;
	font-size: var(--font-s);
	text-transform: uppercase;
	line-height: .9em ;
	text-align: center;
	opacity: 0;
	z-index: 999 ;
}
.post-template-ftr-navigation .dp_oc_item:after{
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	height: 100%;
	width: 100%;
	content: '';
	display: block;
	opacity: 0;
	pointer-events: none !important;
}
@media only screen and (min-width: 981px){
	/* on hover */
	.post-template-ftr-navigation .dp_oc_item:hover .dp_oc_post_title{
		opacity: 1;
	}
	.post-template-ftr-navigation .dp_oc_item:hover:after{
		opacity: .9;
	}
}



/* ------------------------------------------------------------------------- */
/* LINKS */
/* ------------------------------------------------------------------------- */
a:link{
	-webkit-transition: var(--trans-fast) !important;
	-moz-transition: var(--trans-fast) !important;
	-o-transition: var(--trans-fast) !important;
	-ms-transition: var(--trans-fast) !important;
	transition: var(--trans-fast) !important;
}
a:link:not(a.et_pb_button, a.et_pb_video_play) {
	color: var(--yellow) ;
}
a:visited {
	color: var(--yellow) !important;
}
a:hover:not(.et_pb_post a, .owl-carousel a) {
	opacity: .5 ;
}
a:active {
	color: var(--yellow) !important;
}

/* ------------------------------------------------------------------------- */
/* Login */
/* ------------------------------------------------------------------------- */
.tml{
	font-size:20px!important;
}
.tml *{
	color: var(--yellow) !important;
}

.tml-field{
	padding: .7em 1em!important;
	border: 1px solid var(--yellow)!important;
	background: var(--transparent)!important;
}
.tml-button{
	font-size:20px!important;
	padding: .3em 1em!important;
	background:var(--transparent)!important;
	border: 1px solid var(--yellow)!important;
	border-radius: 25px !important;
}
.tml-button:hover{
	background: var(--yellow) !important;
	border: 1px solid var(--yellow)!important;
	color: var(--blue)!important;
}

/* errors */.tml .tml-error {
	color: var(--yellow) !important; 
	border: 1px solid var(--red)!important;
	text-transform: capitalize; 
	font-size: 18px;
	letter-spacing:0px;
	line-height:1.3em!important;
	box-shadow:none!important;
	padding:25px;
}

/* Success */.tml .tml-success {
	color: var(--green);
	border: 1px solid var(--green)!important;
	text-transform: capitalize; 
	font-size: 18px;
	letter-spacing:0px;
	line-height:1.3em!important;
	box-shadow:none!important;
	padding:25px!important;
}

/* message */.tml-message {
	color: var(--blue); 
	border: 1px solid var(--blue)!important;
	text-transform: capitalize; 
	font-size: 18px;
	letter-spacing:0px;
	line-height:1.3em!important;
	box-shadow:none!important;
	padding:25px!important;}

/* passwords */
#pass-strength-result.short {
    background-color: var(--red);
    border-color: var(--red);
    opacity: 1;
}
#pass-strength-result.bad {
    background-color: var(--pink);
    border-color: var(--pink);
    opacity: 1;
}
#pass-strength-result.good {
    background-color: var(--yellow);
    border-color: var(--yellow);
	color: var(--blue) !important;
    opacity: 1;
}
#pass-strength-result.strong {
    background-color: var(--green);
    border-color: var(--green);
    opacity: 1;
}
/* ------------------------------------------------------------------------- */
/* COOKIES */
/* ------------------------------------------------------------------------- */

.cky-consent-container{
	bottom: 75px !important ;
	left: 50% !important ; 
	transform: translateX(-50%) !important;
	width: 90% !important ;
	max-width: 500px !important ;
	border-radius: 50px !important;
	border: 1px solid var(--yellow) !important;
	background: var(--rust) !important;
	overflow: hidden !important;
}
.cky-consent-container .cky-consent-bar{
	padding: 15px 30px !important;
	box-shadow: none !important;
	background: var(--transparent) !important;
	border: 0px !important;
}
.cky-title{
	display: none !important;
}
.cky-notice-des{
	padding: 5px !important;
	flex-grow: 1 !important;
	text-align: center !important;
}
.cky-notice-des p{	
	line-height: 1em !important;
	color: var(--yellow) !important;
}
.cky-notice-btn-wrapper{
	display: flex;
	flex-flow: row nowrap !important;
	grid-gap: 15px !important;
}
.cky-btn {
	border: 1px solid var(--yellow) !important;
	background: var(--yellow) !important;
	color: var(--rust) !important;
	border-radius: 50px !important;
	padding: .3em 2em !important;
	margin: 0px !important;
	-webkit-transition: var(--trans-300) !important;
	-moz-transition: var(--trans-300) !important;
	-o-transition: var(--trans-300) !important;
	-ms-transition: var(--trans-300) !important;
}
.cky-btn:hover {
	color: var(--yellow) !important;
	background: var(--rust) !important;
}

/* ------------------------------------------------------------------------- */
/* MOBILE */
/* ------------------------------------------------------------------------- */
@media only screen and (max-width:980px){
	.page-id-342, body.custom-background{
		background: black !important;
	}
	/* proj template */
	#project-carousel .owl-nav:before{
		height: 3px;
	}
}

@media only screen and (max-width: 767px){
	/* biogrphay and images */
	.del-bio-row .et_pb_column{
		grid-template: auto / 1fr 4fr;
		grid-template-areas: 
			'image1 text1'
			'image2 text2'
			'image3 text3'
			;
	}
	.del-bio-img{
		margin: 0px !important;
	}
	/* proj template */
	.project-carousel-row{
		padding-left: 17vw !important;
	}
}
@media only screen and (min-width: 601px){
	#mobile-menu{
		display: none !important;
	}	
	/* slide in menu action */
	.slide-in-bottom .menu-item{
		transform: translateY(-200%) scale(100%);
	}
	.slide-in-bottom .jwd-filter{
		transform: translateY(-200%);
	}
	/* proj temp */
	.project-ftr-nav {
		min-height: 101vh ;
	}
}
@media only screen and (max-width: 600px){
	/* scroll  down text */
	.del-scroll-row{
		top: 90%;
	}
	/* header and navigation */
	.slide-in-menu-top{
		height: auto !important;
		top: 0 !important;
	}
	.page-id-46 .slide-in-menu-top, .page-id-46 .slide-in-top, .page-id-48 .slide-in-menu-top, .page-id-48 .slide-in-top, .slide-in-menu-top, .slide-in-top{
		background: var(--transparent) !important;
	}
	.slide-in-menu-bottom{
		bottom: -100%;
		display: flex;
		flex-direction: column;
		justify-content: center;
		border-top: 1px solid var(--yellow);
	}
	/* movement strapline */
	.movement-choreography {
		display: none !important;
	}
	/* mobile hamburger */
	#mobile-menu{
		height: 60px;
		width: 60px;
		border-radius: 50%;
		background: var(--yellow);
		color: var(--black);
		margin-bottom: 15px !important;
	}
	#mobile-menu, #mobile-menu .et_pb_code_inner{
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.mobile-menu, .mobile-close{
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50% , -50%);
		display: block;
		width: auto;
		height: auto;
		font-size: var(--font-xs);
		-webkit-transition: var(--trans-fast) !important;
		-moz-transition: var(--trans-fast) !important;
		-o-transition: var(--trans-fast) !important;
		-ms-transition: var(--trans-fast) !important;
		transition: var(--trans-fast) !important;
	}
	#mobile-menu .mobile-close, #mobile-menu.open .mobile-menu{
		opacity: 0;
		transform: translate(-50% , -50%) rotate(360deg);
	}
	#mobile-menu .mobile-menu, #mobile-menu.open .mobile-close{
		opacity: 1;
		transform: translate(-50% , -50%) rotate(-360deg);
	}
	/* menu */
	.slide-in-menu-bottom .et_pb_column{
		grid-template: auto / 1fr;
		grid-template-areas: 
			'filters'
			'about'
			'contact'
			;
	}
	/* filters */
	.slide-in-menu-bottom .jwd-filter .sf-field-category ul{
		grid-template: auto / 1fr;
		grid-template-areas:
			'fashion'
			'art'
			'film'
			'theatre'
			;
	}
	/* biogrphay and images */
	.del-bio-row .et_pb_column{
		grid-template: auto / 1fr;
		grid-template-areas: 
			'text1'
			'image1'
			'text2'
			'image2'
			'text3'
			'image3'
			;
	}
	/* proj template */
	.project-carousel-row{
		padding-left: 0px !important;
	}
	#project-carousel .owl-nav {
		top: calc(100% + 30px);
		left: 50%;
		transform: translate(-50% , 0);
	}
	/* cookies */
	.cky-consent-container{
		bottom: 15px !important ;
	}
	.cky-consent-container .cky-consent-bar{
		padding: 15px !important;
	}
}