/* ------------------------------------------------------------------
   MKonline additional or amended styles
   5.11.19
------------------------------------------------------------------ */




/* =============================== */
/* ===== GENERAL ================= */
/* =============================== */



/* ===============
   --- COLOURS --- */


:root {
	--white: #FFF;
	--light-bg: #FFF;
	--dark-bg: #2A2732;
	
	--text-0: #3D3946;
	--text-1: #3D3946DD; /*#615D6B;*/
	--text-2: #3D3946BB; /*#9692A0;*/
	--text-3: #3D394688; /*#B0ADB8;*/
	--text-4: #3D394644; /*#CAC8D0;*/
	--text-5: #3D394633; /*#D8D6DE;*/
	
	--dark-text-0: #FFFFFF;
	--dark-text-1: #FFFFFFDD;
	--dark-text-2: #FFFFFFBB;
	--dark-text-3: #FFFFFF88;
	--dark-text-4: #FFFFFF66;
	--dark-text-5: #FFFFFF44;
	
	/* Headings, callouts, etc */
	--accent1: #6C14EB; /* Purple */
	--accent1-light: #A490FA;
	--accent1-tint: #6C14EB55;
	--accent1-lighttint: #6C14EB22;
	--accent1-bright: #4918F3;
	
	/* Action buttons, links, etc */
	--accent2: #EB1453; /* Red */
	--accent2-tint: #EB145355;
	--accent2-alttint: #EB145399;
	--accent2-lighttint: #EB145311;
	--accent2-light: #FF84A8;
	
	--accent3: #03CC99; /* Green */
	--accent3-tint: #03CC9955;
	--accent3-lighttint: #03CC9933;
	--accent3-light: #6CEDCC;
	--accent3-lighter: #A0F2DE;
	
	--accent4: #FFF084; /* Yellow */
	--accent4-lighttint: #FFF08499;
	--accent4-lightertint: #FF24E544; /* #FFF08433; */
	--accent4-light: #FFF5AD;
	
	--accent5: #87B3FF; /* Blue */
	--accent5-lighttint: #87B3FF33;
	--accent5-light: #C8DCFF;
	
	--accent6: #FF24E5; /* Pink */
	--accent6-lightertint: #FF24E544;
}




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


/* --- IMPORT FONTS --- */


@import url('https://fonts.googleapis.com/icon?family=Material+Icons');



/* --- RESETTING --- */


html { font-size: 18px !important; }

@media only screen and (min-width: 480px) {
	html { font-size: 18px !important; }
}

@media only screen and (min-width: 1000px) {
	html { font-size: 20px !important; }
}


body {
	font-family: 'SF Pro Display', 'Rubik', sans-serif !important;
	font-size: 1rem !important;
	font-weight: 300 !important;
	line-height: 1.5 !important;
	letter-spacing: normal !important;
	color: var(--text-0) !important;
}

p, ul, ol, li {
	font-size: 1rem !important;
	margin-bottom: 0 !important;
	font-weight: normal !important;
	//color: #444 !important;
}

.container-wrap .wpb_text_column:not(:last-child) {
	padding-bottom: 1em !important;
}

a {
	font-family: 'SF Pro Display', 'Rubik', sans-serif !important;
	color: var(--accent2) !important;
}

strong, b {
	font: inherit !important;
}

ul, ol {
	padding-bottom: 1em !important;
}

li {
	margin-bottom: 0.5em !important;
}

h1, h2, h3, h4, h5, h6 {
	font: inherit !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
}

h1 {
	font-size: 2rem !important;
}

h5 {
	padding: 20px 0;
	letter-spacing: 0 !important;
}

a em {
	color: var(--accent2) !important;
	target-new: tab;
}

a em:hover {
	text-decoration: underline;
}





/* ================
   --- HEADINGS --- */


/* --- SECTION HEADING --- */

.section-heading h5, .section-heading h4, .project-section-title h2 {
	
	/* - Style - */
	font-size: 0.7rem !important;
	font-weight: 600 !important;
	letter-spacing: 0.05rem !important;
	text-transform: uppercase;
	color: #9692A0 !important;
	
	/* - Layout - */
	text-align: left;
}

body:not(.home) .section-heading h5, body:not(.home) .section-heading h4, body:not(.home) .project-section-title h2 {
	
	/* - Spacing - */
	margin-top: 4em;
	margin-bottom: 0.5em !important;
}

@media only screen and (min-width: 1000px){
	
	body:not(.home) .section-heading h5, body:not(.home) .section-heading h4, body:not(.home) .project-section-title h2 {
		
		/* - Spacing - */
		margin-top: 6em;
		margin-bottom: 1em !important;
	}
	
}


/* --- HEADING --- */

.heading h3, .project-subtitle h2, .project-subtitle h3 {
	
	/* - Style - */
	font-size: 1.5rem !important;
	font-weight: 600 !important;
	color: var(--accent1) !important;
	
	/* - Layout - */
	text-align: left;
	
	/* - Spacing - */
	margin-bottom: 1em !important;
}

/* Short line beneath each heading */
.heading h3::after, .project-subtitle h2::after, .project-subtitle h3::after {
	
	/* - Style - */
	content: '';
	background-color: var(--accent1) !important;
	opacity: 1;
	
	/* - Layout - */
	display: block;
	height: 3px;
	width: 24px;
	
	/* - Spacing - */
	margin-top: 0.8em !important;
	margin-bottom: 1em !important;
}


.heading h4 {
	
	/* - Style - */
	font-size: 1.2rem !important;
	font-weight: 700 !important;
	color: var(--accent1) !important;
	
	/* - Layout - */
	text-align: left;
	
	/* - Spacing - */
	margin-top: 2em !important;
	margin-bottom: 1em !important;
}


.comment, del {
	
	font-size: 0.9em !important;
	font-style: italic !important;
	font-weight: normal !important;
	color: var(--accent3);
	//color: var(--text-3);
	//background-color: rgba(255, 255, 0, 0.55) !important;
	background-image: linear-gradient(transparent 30%, var(--accent4-lighttint) 30%, var(--accent4-lighttint) 80%, transparent 80%);
	background-image: -moz-linear-gradient(transparent 30%, var(--accent4-lighttint) 30%, var(--accent4-lighttint) 80%, transparent 80%);
	background-image: -webkit-linear-gradient(transparent 30%, var(--accent4-lighttint) 30%, var(--accent4-lighttint) 80%, transparent 80%);
	text-decoration: none;
	position: relative;
	//top: -0.1em !important;
	padding: 0 0.2em !important;
	opacity: 1;
	
}

.comment a em, del a em {
	color: var(--accent2-light) !important;
}

.dark .heading h4 {
	color: var(--accent1) !important;
}



@media only screen and (min-width: 1000px) {
	
	.heading h3, .project-subtitle h2, .project-subtitle h3 {
		
		/* - Style - */
		font-size: 2rem !important;
		
	}
	
}




/* ----------------------- *
 * --- GLOBAL ELEMENTS --- *
 * ----------------------- */



.hide {
	display: none !important;
}

.flex-row {
	display: flex;
	flex-direction: row;
	justify-content: flex-start;
	align-items: center;
}

.break {
	//flex-basis: 100% !important;
	//height: 0 !important;
	//background-color: red !important;
	page-break-after: always !important;
	break-after: always !important;
}

.fit-height .wpb_wrapper {
	//background-color: aqua;
	height: 100%;
}

.fit-height .wpb_wrapper img {
	//border: solid 1px red;
	//object-fit: cover;
	height: 100% !important;
}

.full-width {
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}


/*.full-width-content { margin-left: -18px !important; }
@media only screen and (min-width: 690px) { .full-width-content { margin-left: -28px !important; }}
@media only screen and (min-width: 1000px) { .full-width-content { margin-left: -90px !important; }}*/


/* =================
   --- CONTAINER --- */

.container-wrap > .container {
	max-width: none !important;
	padding: 0 18px !important;
}

@media only screen and (min-width: 690px) {
	.container-wrap > .container {
		padding: 0 28px !important;
	}
}

@media only screen and (min-width: 1000px) {
	.container-wrap > .container {
		padding: 0 90px !important;
	}
}



/* ==============
   --- BLOCKS --- */

.container-wrap .wpb_row:not(:first-child) {
	padding-top: 2em !important;
	padding-bottom: 2em !important;
	margin-bottom: 0 !important;
}

.container-wrap > .wpb_row .wpb_row {
	padding-top: 2em !important;
	padding-bottom: 2em !important;
}

.container-wrap > .wpb_row .wpb_row:last-child {
	padding-bottom: 0 !important;
}


/* --- Set max width --- */

.container-wrap .wpb_row:not(.full-width-section):not(.full-width-content) {
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 700px;
}

.container-wrap .wpb_row.full-width-section, .container-wrap .wpb_row.full-width-section .wpb_row {
	//margin-left: auto !important;
	//margin-right: auto !important;
	max-width: none !important;
}

.container-wrap .wpb_row.full-width-content, .container-wrap .wpb_row.full-width-content .wpb_row {
	//margin-left: auto !important;
	//margin-right: auto !important;
	max-width: none !important;
}


@media only screen and (min-width: 900px) {

	.container-wrap .wpb_row:not(.full-width-section):not(.full-width-content) {
		max-width: 800px;
	}
}




/* ===================
   --- TEXT BLOCKS --- */





.container-wrap .wpb_row:not(.full-width-section):not(.full-width-content) .wpb_text_column {
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 800px !important;
}







/* =======================
   --- IMAGE SEPARATOR --- */

.image-separator {
	margin-top: 2em !important;
}

.image-separator .col {
	padding-top: 4em !important;
	padding-bottom: 4em !important;
}





/* ==============
   --- IMAGES --- */

img {
	object-fit: cover;
}

.container-wrap .wpb_row img {
	//margin-top: 2em !important;
	//margin-bottom: 0 !important;
	margin: 2em auto 0 !important;
	border-radius: 0.4em;
	object-fit: cover;
}

.container-wrap .wpb_row .portfolio-items img {
	margin-top: 0 !important;
}

.container-wrap .wpb_row img.nomargin {
	margin-top: 0 !important;
}

.rounded img {
	border-radius: 0.4em !important;
}

.floating img {
	box-shadow: 0 1em 1em rgba(0,0,0,0.2);
	transition: all 0s linear;
}

.floating li {
	padding: 1em !important;
}


/* --- Image 2-up --- */

.container-wrap .image-2up img {
	height: auto !important;
	width: 100%;
}

@media only screen and (min-width: 480px) {

	.container-wrap .image-2up .wpb_wrapper {
		display: flex;
		flex-direction: row;
		justify-content: center;
		flex-wrap: wrap;
	}
	
	.container-wrap .image-2up img {
		height: 200px !important;
		width: auto;
	}
}

@media only screen and (min-width: 690px) {
	
	.container-wrap .image-2up img {
		height: auto !important;
		//width: calc(50% - 80px) !important;
	}
}

@media only screen and (min-width: 1000px) {
	
	.container-wrap .image-2up img {
		height: 320px !important;
		width: auto;
	}
	
	.container-wrap .image-2up .wpb_wrapper div {
		margin-right: 40px !important;
	}
	
	.container-wrap .image-2up img:last-child {
		margin-top: 0 !important;
	}
	
	.container-wrap .image-2up .wpb_wrapper div:last-child {
		margin-right: 0 !important;
	}
}

@media only screen and (min-width: 1200px) {
	
	.container-wrap .image-2up img {
		height: 360px !important;
		width: auto;
	}
}

@media only screen and (min-width: 1400px) {
	
	.container-wrap .image-2up img {
		height: 480px !important;
		width: auto;
	}
}



/* ====================================
   --- PRIVATE PAGE : Title Styling --- */

.private-prefix {
	
	/* - Style - */
	background-color: rgba(255, 87, 87, 1) !important;
	border-radius: 50% !important;	
	opacity: 1 !important;
	
	/* - Layout - */
	display: flex;
	align-items: center;
	width: 8px !important;
	height: 8px !important;
	position: absolute !important;
	top: 0.2em !important;
	left: -1em !important;
	
	/* - Spacing - */
	padding: 0 !important;
}


/* --- MENU ---
   ------------ */

#slide-out-widget-area-bg, #slide-out-widget-area-bg.fullscreen-alt .bg-inner {
	background: var(--dark-bg) !important;
}

#slide-out-widget-area {
	//display: flex !important;
	//justify-content: space-between;
}

.menu.menuopen {
	
	/* - Layout - */
	display: flex;
	flex-direction: column;
	
	/* - Spacing - */
	margin-top: 90px !important;
	margin-left: 90px !important;
}

.menu.menuopen .menu-item {
	display: inline-flex;
	width: auto;
}

.menu.menuopen .menu-item a {
	
	/* - Style - */
	font-size: 1.5rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.05em !important;
	color: var(--accent2) !important;
	opacity: 1 !important;
	
	/* - Layout - */
	width: auto;
}

#slide-out-widget-area .menu.menuopen li.menu-item a:hover {
	
	/* - Style - */
	color: var(--accent2) !important;
}

#slide-out-widget-area .menu.menuopen li.menu-item a::after {
	
	/* - Style - */
	content: '';
	background-color: var(--accent2) !important;
	opacity: 0;
	
	/* - Layout - */
	display: block;
	height: 3px;
	width: 24px;
	
	/* - Spacing - */
	margin-top: 0.1em !important;
	margin-bottom: 0em !important;
}

#slide-out-widget-area .menu.menuopen li.menu-item a:hover::after {
	
	/* - Style - */
	opacity: 1;
}

#slide-out-widget-area #text-2 {
	max-width: none;
	margin-top: 90px;
	text-align: left;
}

#slide-out-widget-area #text-2 h4, #slide-out-widget-area #text-2 a {
	color: var(--accent3) !important;
}

#slide-out-widget-area .off-canvas-social-links {
	right: auto !important;
	left: 90px !important;
}

#slide-out-widget-area .off-canvas-social-links i {
	color: var(--accent4) !important;
}



/* ---------------- *
 * --- HOMEPAGE --- *
 * ---------------- */


/* ************
   >>> HEAD <<<
   ************ */


/* ===================
   --- INTRO (OLD) --- */

#home-intro {
	overflow: visible !important;
	height: 100vh !important;
}

#home-intro .using-image {
	background-size: 80vh !important;
	background-position-y: 20% !important;
	overflow: visible !important;
}

#home-intro .using-image::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	background-color: var(--light-bg) !important;
	width: 100%;
	height: 100%;
	opacity: 0.3;
}

#home-intro h1 {
	font-size: 5vmax !important;
	line-height: 1.1em !important;
	color: var(--accent1) !important;
}

#home-intro .home-intro-message .wpb_wrapper {
	margin: 0 !important;
}

#home-intro .home-intro-message h1 {
	font-size: 5vh !important;
	font-weight: 500;
	line-height: 1.1em !important;
	letter-spacing: -0.02em !important;
	color: #B0ADB8 !important;
}

#home-intro .home-intro-message h1 strong {
	font-weight: 500;
	color: var(--accent1) !important;
}

#home-intro .home-intro-message h1 em {
	font-style: normal;
	font-weight: 500;
	color: #A490FA !important;
}

@media only screen and (min-width: 1400px) {
	
	#home-intro h1 {
		font-size: 6vh !important;
	}
	
}



/* =============================
   --- HOME INTRO : OCT 2019 --- */

#home-header {
	margin-top: 2vmax !important;
	padding-top: 0 !important;
	margin-bottom: 2em !important;
}

#home-header .wpb_wrapper {
	display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    height: 90% !important;
    margin-top: 1em;
	//padding-top: 5vh !important;
	//padding-bottom: 3vh !important;
}

#home-header div.img-with-aniamtion-wrap { display: none !important; }

#home-header .mkavatar {
	border-radius: 50%;
	width: 60%;
	height: auto;
	margin: 0 !important;
	object-fit: cover;
	display: none;
}

#home-header .home-intro-message {
	flex: 1;
	margin: 0 !important;
	padding: 0 !important;
	max-width: 50em;
	//margin-bottom: auto !important;
}

#home-header .home-intro-message .wpb_wrapper {
	margin: 0 !important;
	display: flex;
	flex-direction: column;
	justify-content: center !important;
}

#home-header .home-intro-message h1 {
	//font-size: 5.5vh !important;
	font-size: calc(3vh + 1em) !important;
	font-weight: 400 !important;
	line-height: 1.1em !important;
	letter-spacing: -0.02em !important;
	color: var(--text-0) !important;
}

#home-header .home-intro-message h1 strong {
	color: var(--accent1) !important;
}

#home-header .home-intro-message h1 em {
	font-style: normal;
	color: var(--accent1) !important;
}


/* --- Responsive --- */

@media only screen and (min-width: 480px) {
	#home-header .home-intro-message h1 { font-size: calc(4vh + 1em) !important; }}

@media only screen and (min-width: 690px) {
	#home-header .home-intro-message h1 { font-size: calc(5vh + 1em) !important; }}

@media only screen and (min-width: 1000px) {
	#home-header .home-intro-message h1 { font-size: calc(6vh + 1em) !important; }}

@media only screen and (min-width: 1200px) {
	#home-header .home-intro-message h1 { font-size: calc(6vh + 1em) !important; }}


/* ========================
   --- Navigation lists --- */


/*
.container-wrap .nav-list {
	padding-top: 1em !important;
	padding-bottom: 0 !important;
}
*/

#home-nav {
	margin: 0 !important;
	padding: 0 !important;
}

#home-nav.nav-list .wpb_wrapper {
	display: grid !important;
	grid-template-columns: 1fr 1fr;
	column-gap: 16px;
	row-gap: 16px;
	width: 100% !important;
}

#home-nav.nav-list a.nectar-button.nav-button {
	font-size: 0.8rem !important;
	font-weight: 600 !important;
	//text-transform: lowercase;
	background-color: none !important;
	border: none !important;
	padding: 1em 0 !important;
	margin: 0 !important;
	border-top: 3px solid var(--text-0) !important;
	border-radius: 0 !important;
}

/*
#home-nav.nav-list a.nectar-button.nav-button:not(:last-child) {
	margin-right: 1em !important;
}
*/

#home-nav a.nav-button span {
	letter-spacing: -0.02rem !important;
}

#home-nav a.nav-button span {
	color: var(--text-0) !important;
}

#home-nav a.nav-button:hover span {
	color: var(--accent2) !important;
}

@keyframes lines {
	from {background-position-y: 0;}
	to {background-position-y: -8px;}
}

#home-nav.nav-list a.nav-button:hover {
	border-top-color: var(--accent2) !important;
	background: repeating-linear-gradient(
		-45deg,
		var(--accent2-tint),
		var(--accent2-tint) 1.5px,
		transparent 1.5px,
		transparent 6px
	);
	animation-name: lines;
	animation-duration: 0.5s;
	animation-direction: reverse;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}

#home-nav.nav-list a.nav-button::before {
	content: "";
	display: block;
	width: 100%;
	height: 8px;
	background-color: white;
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 1;
}

#home-nav.nav-list a.nav-button::after {
	content: "";
	border-left: 2.5em solid transparent;
	border-bottom: 2.5em solid white;
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
}


@media only screen and (min-width: 690px) { #home-nav.nav-list .wpb_wrapper { grid-template-columns: 1fr 1fr 1fr; } }

@media only screen and (min-width: 1000px) {
	
	#home-nav.nav-list .wpb_wrapper {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
	}
	
	#home-nav.nav-list a.nectar-button.nav-button { padding: 1em 0 5em 1em !important; }
}


/* --- Homepage menu --- */

.homepage-menu {
	margin: 2em 0;
}

.homepage-menu ul {
	display: flex;
	justify-content: space-between;
	margin: 0;
}

.homepage-menu li {
	list-style: none;
}

.homepage-menu li a {
	color: var(--text-2) !important;
}



/* ===================
   --- HEADER LOGO --- */

body #header-outer {
	//background: transparent !important;
	display: flex;
	justify-content: center;
	border-bottom: none !important;
}

body #header-outer .container {
	//max-width: 1425px !important;
	margin: 0 auto !important;
	//padding: 0 !important;
}
	
#top nav ul a {
	border: none !important;
}
	
#top nav ul a::after {
	border: none !important;
}
	
	


/* --- AT TOP --- */

/* - Nav Button (Burger menu) - */
.home .at-top:not(.scrolling) #top nav {
	visibility: hidden;
	opacity: 0;
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
	height: inherit;
}

.home .side-widget-open #top nav {
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

/* - Header - */
.home .at-top:not(.scrolling) #top, body .side-widget-open #top, body :not(.small-nav) #top {
	//height: 0;
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

.home .at-top:not(.scrolling) #top .container, .home .side-widget-open #top .container, .home :not(.small-nav) #top .container {
	//padding-left: 90px !important;
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

/* - Logo - */
.home .at-top:not(.scrolling) #top a#logo, .home .side-widget-open #top a#logo, .home :not(.small-nav) #top a#logo {
	//margin-top: 8vh !important;
	//margin: 0;
	top: 8vh;
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

.home .at-top:not(.scrolling) #top a#logo img, .home .side-widget-open #top a#logo img, .home :not(.small-nav) #top a#logo img {
	//height: 9vh !important;
	width: auto !important;
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}


/* --- SCROLLING --- */

.home #top .container {
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

.home .at-top.scrolling #top {
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

.home .at-top.scrolling #top nav {
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

.home .at-top.scrolling #top .container {
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

.home .at-top.scrolling #top a#logo, .home .small-nav #top a#logo {
	top: 0;
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}

.home .at-top.scrolling #top a#logo img {
	transition: all 0.5s cubic-bezier(.05,.01,.3,1);
}



@media only screen and (min-width: 480px) {
	
	.home .at-top:not(.scrolling) #top a#logo img, .home .side-widget-open #top a#logo img, .home :not(.small-nav) #top a#logo img {
		//height: 9vh !important;
	}
}

@media only screen and (min-width: 690px) {
	
	.home .at-top:not(.scrolling) #top a#logo img, .home .side-widget-open #top a#logo img, .home :not(.small-nav) #top a#logo img {
		//height: 9vh !important;
	}
}

@media only screen and (min-width: 1000px) {
	
	body #header-outer {
		background: transparent !important;
	}
	
	.home .at-top:not(.scrolling) #top .container, .home .side-widget-open #top .container, .home :not(.small-nav) #top .container {
		padding-left: 90px !important;
	}
	
	.home .at-top:not(.scrolling) #top a#logo img, .home .side-widget-open #top a#logo img, .home :not(.small-nav) #top a#logo img {
		height: 4em !important; /*calc (1em + 4vh) !important;*/
	}
}


/* --------------------
   --- Agent Button --- */

#agent-button {
	position: absolute;
	bottom: 4em;
	right: 1em;
	display: none;
}




/* ************
   >>> BODY <<<
   ************ */






/* ---------------- *
 * --- PROJECTS --- *
 * ---------------- */


/* **************
   >>> HEADER <<<
   ************** */


/* =====================================
   --- HEADER & TITLE (Blocky Style) --- */


/* - Layout - */

body #page-header-bg .page-header-bg-image {
	background-position: center !important;
}

body #page-header-bg .page-header-bg-image::after {
	display: none;
}

body #page-header-bg .span_6, body #page-header-bg .span_6 .inner-wrap, body #page-header-bg[data-parallax="1"] .span_6, body #page-header-bg[data-parallax="1"] .span_6 .inner-wrap {
	display: block !important;
}

body #page-header-bg .span_6 .inner-wrap, body #page-header-bg[data-parallax="1"] .span_6 .inner-wrap, body #page-header-bg.fullscreen-header .span_6 .inner-wrap {
	display: flex !important;
	justify-content: flex-start !important;
	flex-direction: column !important;
	align-items: flex-start !important;
	text-align: left !important;
}

/* - Title H1 - */

body #page-header-bg h1 {
	
	/* - Style - */
	font-size: 1.8rem !important;
    font-weight: 500 !important;
    line-height: 1.2em !important;
    text-transform: none !important;
	color: var(--dark-text-1) !important;
	
	/* - Layout - */
    position: relative !important;
	text-align: left !important;
	display: inline !important;
	background-color: var(--dark-bg) !important;
	box-shadow: 0.35em 0 0 0 var(--dark-bg), -0.35em 0 0 0 var(--dark-bg);
    z-index: 999;
    width: -webkit-fit-content !important;
    width: -moz-fit-content !important;
    width: fit-content !important;
    
	/* - Spacing - */
	padding: 0.15em 0;
    margin: 0 0 0.2em !important;
}


/* - Subheader - */

/*
body #page-header-bg .subheader::before {
	
	content: '\A';
	white-space: pre;
	white-space: -webkit-pre;
	white-space: -moz-pre;
	
}
*/

body #page-header-bg .subheader, body #page-header-bg.fullscreen-header .subheader {
	
	/* - Style - */
	font-family: inherit !important;
	font-size: 1.5rem !important;
	font-weight: 500 !important;
	line-height: 1.5em !important;
	color: var(--accent1) !important;
	
	/* - Layout - */
	text-align: left;
	display: inline !important;
	background-color: var(--light-bg) !important;
	box-shadow: 0.4em 0 0 0 #fff, -0.4em 0 0 0 #fff;
	-webkit-box-decoration-break: clone;
	-ms-box-decoration-break: clone;
	-o-box-decoration-break: clone;
	box-decoration-break: clone;
    width: fit-content !important;
    width: -webkit-fit-content !important;
    width: -moz-fit-content !important;
    overflow: visible;
    
	/* - Spacing - */
	padding: 0.15em 0;
}


/* - Fullscreen - */

body #page-header-bg.fullscreen-header h1, body #page-header-bg.fullscreen-header .subheader {
	
}


@media only screen and (min-width: 480px) {
	
	body #page-header-bg .subheader, body #page-header-bg.fullscreen-header .subheader, body #page-header-bg p, body #page-header-bg.fullscreen-header p {
		
		/* - Style - */
		max-width: 70% !important;
		
	}

}




/* -------------------------- *
 * --- TWEAKED COMPONENTS --- *
 * -------------------------- */


/* ******************
   *** PORTFOLIOS *** */



/* ===========================================
   --- POST-STYLE PORTFOLIO (Show as list) --- */


/* - Container - */
#casestudies .nectar-post-grid {
	
	/* - Style - */
	color: #000 !important;
	
	/* - Layout - */
	display: flex !important;
	text-align: left !important;
}

#casestudies .nectar-post-grid-item {
	
	/* - Layout - */
	display: flex !important;
	flex-direction: column !important;
	height: 100% !important;
	min-height: 30vmin !important;
	//max-height: 40vh !important;
	
	/* - Spacing - */
	margin-bottom: 6em !important;
}

#casestudies .nectar-post-grid-item:hover .nectar-post-grid-item-bg {
	
	/* - Style - */
	transform: none !important;
	//background-size: 120%;
	
	/* - Animation - */
	transition: background-size 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

#casestudies .nectar-post-grid-item .nectar-post-grid-item-bg::after {
	
	/* - Style - */
	content: '';
	border-radius: 0.4em;
	background-color: var(--accent1) !important;
	opacity: 0 !important;
	
	/* - Layout - */
	display: block;
	height: 100%;
	
	/* - Animation - */
	transition: opacity 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

#casestudies .nectar-post-grid-item:hover .nectar-post-grid-item-bg::after {
	
	/* - Style - */
	opacity: 0.2 !important;
	
	/* - Animation - */
	transition: opacity 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

/* - Inner - */
#casestudies .nectar-post-grid .inner {
	
	/* - Style - */
	background: none !important;
	
	/* - Layout - */
	display: flex !important;
	flex-direction: column !important;
	//align-items: stretch !important;
}

#casestudies .nectar-post-grid .inner > div {
	
	/* - Style - */
	//border: 1px solid red;
	
	/* - Layout - */
	flex-grow: 1 !important;
	flex-basis: 90%;
}


/* - Image - */
#casestudies .nectar-post-grid .nectar-post-grid-item-bg {
	
	/* - Style - */
	border-radius: 0.4em !important;
	
	/* - Layout - */
	position: relative !important;
	background-size: cover;
	//width: 100% !important;
	//flex-basis: 70% !important;
	//left: 40% !important;
	//float: right !important;
	flex-grow: 2;
	
	/* - Spacing - */
	margin-bottom: 1em !important;
	
	/* - Animation - */
	transition: background-size 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}


/* - Content - */
#casestudies .nectar-post-grid .content {
	
	/* - Style - */
	//background-color: var(--accent4) !important;
	
	/* - Layout - */
	display: flex !important;
	justify-content: flex-end !important;
	flex-direction: column-reverse !important;
	position: relative !important;
	flex-grow: 1;
	
	/* - Spacing - */
	padding: 0 !important;
	margin-top: 0 !important;
}


/* - Text - */
#casestudies .nectar-post-grid .item-main {
	
	/* - Style - */
	text-align: left !important;
	color: #000 !important;
	
	/* - Layout - */
	display: flex !important;
	flex-direction: column;
	width: 100% !important;
	text-align: left !important;
}


/* - Subtitle - */
#casestudies .nectar-post-grid .item-meta-extra {
	
	/* - Style - */
	//background-color: var(--accent5) !important;
	
	/* - Layout - */
	order: 1 !important;
	width: 100% !important;
	
	/* - Spacing - */
	margin: 0 0 0.3em !important;
}

#casestudies .nectar-post-grid .meta-excerpt {
	
	/* - Style - */
	color: var(--accent1) !important;
	font-size: 1.2rem !important;
	font-weight: 500 !important;
	line-height: 1.1em !important;
	
	/* - Spacing - */
	margin: 0 !important;
}


/* - Title - */
#casestudies .nectar-post-grid h3 {
	
	/* - Layout - */
	//background-color: var(--accent3) !important;
	order: 2 !important;
	max-width: 100% !important;
}

#casestudies .nectar-post-grid h3 a {
	
	/* - Style - */
	font-size: 1rem !important;
	font-weight: 500 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: rgba(0,0,0,0.6) !important;
}


/* - Date - */
#casestudies .nectar-post-grid .meta-date {
	
	/* - Style - */
	font-size: 0.7rem !important;
	font-weight: 400 !important;
	text-transform: none !important;
	letter-spacing: normal !important;
	color: rgba(0,0,0,0.6) !important;
	
	/* - Layout - */
	order: 3 !important;
	
	/* - Spacing - */
	margin: 1.5em 0 0 !important;
}


/* - Categories - */
#casestudies .nectar-post-grid .meta-category {
	
	/* - Layout - */
	text-align: left !important;
	display: flex;
	flex-wrap: wrap;
}

#casestudies .nectar-post-grid .meta-category a {
	
	/* - Style - */
	color: var(--accent3) !important;
	font-size: 0.7rem !important;
	letter-spacing: 0.05em;
	font-weight: 400 !important;
	text-transform: uppercase !important;
}


/* --- TABLETS & SMALL LAPTOPS --- */
@media only screen and (min-width: 690px) {
	
	body .nectar-post-grid[data-columns][data-grid-spacing="25px"] .nectar-post-grid-item {
		width: 100% !important;
	}
	
	#casestudies .nectar-post-grid-item {
		
		/* - Layout - */
		flex-direction: column;
		height: 100% !important;
		min-height: 40vmin !important;
	}
	
	/* - Inner - */
	#casestudies .nectar-post-grid .inner {
		
		/* - Layout - */
		flex-direction: row-reverse !important;
	}
	
	
	/* - Image - */
	#casestudies .nectar-post-grid .nectar-post-grid-item-bg {
		
		/* - Layout - */
		flex-grow: 2 !important;
		margin-bottom: 0 !important;
	}
	
	/* - Content - */
	#casestudies .nectar-post-grid .content {
		
		/* - Layout - */
		justify-content: space-between !important;
		position: relative !important;
		height: auto !important;
		max-width: 30% !important;
		
		/* - Spacing - */
		margin-top: 0 !important;
		margin-right: 2em !important;
	}
	
	/* - Subtitle - */
	#casestudies .nectar-post-grid .meta-excerpt {
		
		/* - Style - */
		font-size: 1.2rem !important;
	}
}

/* --- TABLETS & SMALL LAPTOPS --- */
@media only screen and (min-width: 1000px) {
	
	/* - Subtitle - */
	#casestudies .nectar-post-grid .meta-excerpt {
		
		/* - Style - */
		font-size: 1.5rem !important;
	}
}




/* ========================
   --- BLOCKY PORTFOLIO --- */


/* --- Coming soon (disable item) --- */

.portfolio-items .coming-soon .work-info::before {
	
	/* - Style - */
	/*font-family: 'Material Icons';*/
	content: 'Coming soon';
	font-size: 0.7rem !important;
	font-weight: 700 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.1em !important;
	color: #fff;
	background-color: var(--accent3);
	box-shadow: 0.45em 0 0px 0px var(--accent3), -0.45em 0 0px 0px var(--accent3);
	
	/* - Layout - */
	position: absolute;
	bottom: 1.5em;
	right: 2em;
	
	/* - Spacing - */
	padding: 0.2em 0;
	margin-left: 0.35em !important;
	
}

.portfolio-items .coming-soon a {
		
	/* - Interaction - */
	pointer-events: none !important;
	cursor: not-allowed !important;
}

.portfolio-items .coming-soon .work-item img {
	
	/* - Style - */
	opacity: 0.5 !important;
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

.portfolio-items .coming-soon .work-item:hover img {
	
	/* - Style - */
	opacity: 1 !important;
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}


/* --- Styling --- */

.portfolio-items {
	
	/* - Layout - */
	justify-content: flex-start;
}

.portfolio-items > div.col.span_6 {
	
	/* - Layout - */
	width: 100% !important;
	
}

#case-studies .portfolio-items > div {
	
	/* - Layout - */
	width: 100% !important;
	
	/* - Spacing - */
	margin-bottom: 0em !important;
}


.portfolio-items .work-item {
	
	/* - Style - */
	border-radius: 0.4em !important;
}

.portfolio-items .work-info {
	
	/* - Layout - */
	display: flex;
	flex-direction: column;
	justify-content: flex-start;
	align-items: flex-start;
	
	/* - Spacing - */
	padding: 1em 1em;
}

#case-studies .portfolio-items .work-info {
	
	/* - Layout - */
	justify-content: center;
	
	/* - Spacing - */
	padding: 1.5em 1em;
}

.portfolio-items .work-info > div {
	
	/* - Layout - */
	display: flex !important;
	justify-content: flex-end;
	flex-direction: column;
	align-items: flex-start;
	text-align: left !important;
	left: auto !important;
	top: auto !important;
	transform: none !important;
	
	/* - Spacing - */
	margin: 0 !important;
	margin-left: 0.35em !important;
}


/* - Titles - */

.portfolio-items .work-info h3 {
	
	/* - Style - */
	font-size: 1rem !important;
	font-weight: 500 !important;
	line-height: 1.3em !important;
    text-transform: none !important;
	background-color: var(--accent1);
	box-shadow: 0.45em 0 0 0 var(--accent1), -0.45em 0 0 0 var(--accent1);
	-webkit-box-decoration-break: clone;
	-ms-box-decoration-break: clone;
	-o-box-decoration-break: clone;
	box-decoration-break: clone;
	
	/* - Layout - */
	display: flex !important;
    width: fit-content !important;
    width: -webkit-fit-content !important;
    width: -moz-fit-content !important;
    z-index: 999;
	
	/* - Spacing - */
	padding: 0.25em 0 !important;
	margin-bottom: 0 !important;
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

#case-studies .portfolio-items .work-info h3 {
	
	/* - Style - */
	font-size: 0.9rem !important;
	
	/* - Layout - */
	max-width: 80% !important;
}


/* - Subtitles - */

:not(#case-studies) .portfolio-items .work-info p {
	
	/* - Layout - */
    //opacity: 0 !important;
    //height: 0 !important;
	
	/* - Spacing - */
	margin-top: 0 !important;
    
}

.portfolio-items .work-info p, .portfolio-items .work-info p span {
	
	/* - Style - */
	font-size: 0.9rem !important;
    font-weight: 400 !important;
	line-height: 1.5em !important;
    //letter-spacing: 0.05rem !important;
    text-transform: none !important;
	color: var(--accent1) !important;
	background-color: var(--light-bg) !important;
	box-shadow: 0.45em 0 0px 0px #fff, -0.45em 0 0px 0px #fff !important;
	-webkit-box-decoration-break: clone !important;
	-ms-box-decoration-break: clone !important;
	-o-box-decoration-break: clone !important;
	box-decoration-break: clone !important;

	opacity: 1 !important;
	
	/* - Layout - */
	display: inline !important;
    width: fit-content !important;
    width: -webkit-fit-content !important;
    width: -moz-fit-content !important;
	
	/* - Spacing - */
	padding: 0.25em 0 !important;
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
		
}

:not(#case-studies) .portfolio-items .work-info p, :not(#case-studies) .portfolio-items .work-info p span {
	
	/* - Layout - */
    opacity: 0 !important;
    //height: 0 !important;
	
	/* - Spacing - */
	margin-top: 0 !important;
    
}

#case-studies .portfolio-items .work-info p {
	
	/* - Layout - */
    opacity: 1 !important;
    height: auto !important;
	
	/* - Spacing - */
	margin-top: 0.5em !important;
	
}

#case-studies .portfolio-items .work-info p, #case-studies .portfolio-items .work-info p span {
	
	/* - Style - */
	font-size: 0.8rem !important;
	
	/* - Layout - */
    opacity: 1 !important;
    height: auto !important;
	max-width: calc(100% - 0.8em) !important;
	
	/* - Spacing - */
	padding: 0.25em 0 !important;
		
}

.container .portfolio-items .work-item .work-info-bg, .container .portfolio-items .col[data-default-color="true"] .work-item:not(.style-3) .work-info-bg {
	background-color: var(--accent1) !important;
}

.portfolio-items .work-item:hover .work-info-bg {
	opacity: 0.75 !important;
}

.portfolio-items .work-item:hover h3 {
	
	/* - Style - */
	background-color: var(--accent2) !important;
	box-shadow: 0.45em 0 0 0 var(--accent2), -0.45em 0 0 0 var(--accent2);
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
	
}

:not(#case-studies) .portfolio-items .work-item:hover p {
	
	/* - Style - */
	opacity: 1 !important;
	
	/* - Layout - */
	height: auto !important;
	
	/* - Spacing - */
	margin-top: 0.5em !important;
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
	
}

:not(#case-studies) .portfolio-items .work-item:hover p, :not(#case-studies) .portfolio-items .work-item:hover p span {
	
	/* - Style - */
	color: var(--accent2) !important;
	opacity: 1 !important;
	
	/* - Layout - */
	height: auto !important;
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
	
}

#case-studies .portfolio-items .work-item:hover h3 {
	
	/* - Style - */
	background-color: var(--accent2) !important;
	box-shadow: 0.45em 0 0 0 var(--accent2), -0.45em 0 0 0 var(--accent2);
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
	
}

#case-studies .portfolio-items .work-item:hover p, #case-studies .portfolio-items .work-item:hover p span {
	
	/* - Style - */
	color: var(--accent2) !important;
	
	/* - Animation - */
	transition: all 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
	
}

/*
#case-studies .portfolio-items .work-item .work-info .vert-center::after {
	
	/* - Style - * /
	font-family: 'Material Icons';
	content: 'visibility';
	font-size: 1.8rem;
    font-weight: 400 !important;
    color: var(--accent1) !important;
	
	/* - Layout - * /
	display: flex !important;
	
	/* - Spacing - * /
	//padding: 0.4em 0;
	margin-top: 0.1em;
	margin-left: -0.8rem;
	
	/* - Animation - * /
	clip-path: inset(50% 0);
	transition: all 0.3s ease 0s !important;
}
*/

/*
#case-studies .portfolio-items .work-item:hover .work-info .vert-center::after {
	
	/* - Animation - * /
	clip-path: inset(0);
	transition: all 0.2s ease 0s !important;
	
}
*/



@media only screen and (min-width: 690px) {
	
	#case-studies .portfolio-items > div { margin-bottom: 1em !important; }
	
	#case-studies .portfolio-items .work-info { justify-content: center !important; }
	
	#case-studies .portfolio-items .work-info > div { margin-left: 2em !important; max-width: 70% !important; }
	
	#case-studies .portfolio-items .work-info h3, #case-studies .portfolio-items .work-info p, #case-studies .portfolio-items .work-info p span { font-size: 1.1rem !important; }
	
}

@media only screen and (min-width: 1000px) {

	.portfolio-items > div.col.span_6 { width: 49.99% !important; }
	
	#case-studies .portfolio-items > div { margin-bottom: 2em !important; }
	
	#case-studies .portfolio-items .work-info > div { max-width: 50% !important; }
	
	#case-studies .portfolio-items .work-info h3, #case-studies .portfolio-items .work-info p, #case-studies .portfolio-items .work-info p span { font-size: 1.3rem !important; }
	
}

@media only screen and (min-width: 1200px) {
	
	#case-studies .portfolio-items > div { margin-bottom: 2em !important; }
	
	#case-studies .portfolio-items .work-info h3, #case-studies .portfolio-items .work-info p, #case-studies .portfolio-items .work-info p span { font-size: 1.6rem !important; }
	
}



/* =========================
   --- GENERAL PORTFOLIO --- */

/* - Subtitles - */

/*.portfolio-items .work-info p {
	font-size: 0.8rem !important;
	line-height: 1.2 !important;
	color: var(--dark-text-1) !important;
	//opacity: 0.7 !important;
}*/




/* ***************************
   *** GALLERIES & SLIDERS *** */


/* ============================================
   --- DEFAULT GALLERY (Remove Nav Buttons) --- */


.wpb_gallery.img-hide img {
	opacity: 0 !important;
}

.container-wrap .wpb_gallery img {
	margin: 0 !important;
	//background-color: red !important;
	min-height: 100px;
}

.wpb_gallery {
	margin-bottom: 0 !important;
	//border: 1px solid red !important;
	min-height: 100px;
}

.wpb_gallery.no-nav .wpb_wrapper .flex-direction-nav {
	display: none !important;
}

.wpb_gallery.no-nav .wpb_wrapper .flex-direction-nav {
	//background-color: #000 !important;
	//border: solid 10px red !important;
}
   

/* ===============================
   --- FLICKITY SLIDER GALLERY --- */

.flickity-viewport {
	margin: 0 !important;
}

button.flickity-button.flickity-prev-next-button::before {
	background-color: var(--accent2) !important;
}

button.flickity-button.flickity-prev-next-button svg path {
	fill: #fff !important;
}

button.flickity-button.flickity-prev-next-button::after {
	background-color: var(--light-bg) !important;
}




/* ========================
   --- IMAGE COMPARISON --- */

.twentytwenty-wrapper {
	padding: 0;
}
.twentytwenty-handle {
	height: 30px;
	width: 30px;
	background-color: #F98B4E !important;
}
.twentytwenty-wrapper .twentytwenty-handle::before, .twentytwenty-wrapper .twentytwenty-handle::after {
	width: 2px !important;
	margin-left: -1px !important;
	background-color: #F98B4E !important;
}




/* ====================================================================
   --- PORTFOLIO 'NEXT-PREV' CONTROLS + PREVIEW (at bottom of page) --- */

#portfolio-nav li {
	border-radius: 0.4em !important;
	margin-bottom: 1em !important;
}

.bottom_controls {
	padding: 8em 1em 1em !important;
	background: none !important;
}

@media only screen and (min-width: 480px) {
	
	#portfolio-nav .previous-project {
		width: 48% !important;
		margin-right: 2% !important;
	}
	
	#portfolio-nav .next-project {
		width: 48% !important;
		margin-left: 2% !important;
	}
	
}

@media only screen and (min-width: 1000px) {
	
	.bottom_controls {
		padding-left: 90px !important;
		padding-right: 90px !important;
	}
	
}


/* Hide nav */

.hide-project-nav .bottom_controls {
	display: none;
	border: 10px solid red !important;
}





/* ----------------- *
 * --- MY BLOCKS --- *
 * ----------------- */



/* ==================
   --- PAGE INTRO --- */

.container-wrap .project-intro, .container-wrap .page-intro {
	padding-top: 4em !important;
}

.container-wrap .project-intro wpb_text_column {
	padding-bottom: 0 !important;
}

.project-intro p, .project-intro h5, .page-intro p, .page-intro h5 {
	
	/* - Style - */
	font-size: 1.2rem !important;
	font-weight: 400 !important;
	line-height: 1.4 !important;
	color: var(--text-0) !important;
}



/* ================
   --- CAPTIONS --- */

.caption p, .caption-below p, .caption-light p, .caption-dark p {
	
	/* - Style - */
    font-size: 0.7rem !important;
    font-style: italic;
    line-height: 1.4 !important;
    color: var(--text-1) !important;
	
	/* - Spacing - */
    padding-bottom: 0.5em !important;
}

/* Caption over image */
.caption, .caption-light, .caption-dark {
    position: absolute;
    bottom: 0;
    padding: 5px 15px 7px;
    z-index: 9999 !important;
}


/* standard version */
.caption p { color: rgba( 0, 0, 0, 0.6) !important; }
.caption { background-color: rgba( 225, 225, 225, 0.1); }

/* light bg, dark text */
.caption-light p { color: rgba( 0, 0, 0, 0.6) !important; }
.caption-light { background-color: rgba( 0, 0, 0, 0.05) !important; }

/* dark bg, light text */
.caption-dark p { color: rgba( 255, 255, 255, 0.6) !important; }
.caption-dark { background-color: rgba( 40, 40, 40, 0.7) !important; }

/* Caption below image */
.caption-below {
    margin-top: 0.5em !important;
    padding: 0px !important;
	margin-left: auto !important;
	margin-right: auto !important;
	max-width: 800px;
}




/* ===================
   --- EXTRA LINKS --- */

#more-work {
	margin-top: 2em !important;
	margin-bottom: 3em !important;
}

.portfolio-items .col.span_6 {
	//width: 49.99% !important;
}

#more-work .portfolio-items .work-item {
	
	/* - Style - */
	border-radius: 0.4em !important;
	
	/* - Layout - */
	height: 10em;
}

#more-work .portfolio-items .work-info {
	
	/* - Layout - */
	align-items: center !important;
	
	/* - Spacing - */
	padding: 0 !important;
}

#more-work .portfolio-items .work-info-bg {
	
	/* - Style - */
	opacity: 0;
	
}

#more-work .portfolio-items .work-info::before {
	
	/* - Style - */
	content: '';
	background-color: var(--accent1);
	opacity: 0.5;
	
	/* - Layout - */
	position: absolute;
	width: 100%;
	height: 100%;
	
	/* - Animation - */
	transition: opacity 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

#more-work .portfolio-items .work-item:hover .work-info::before {
	
	/* - Style - */
	//background-color: var(--text-0);
	opacity: 0.1;
	
	/* - Animation - */
	transition: opacity 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

#more-work .portfolio-items .work-info > div {
	
	/* - Style - */
	//background-color: var(--accent2);
	
	/* - Layout - */
	display: flex;
	justify-content: center;
	align-content: center;
	flex-direction: column;
	align-items: center;
	text-align: center !important;
    //width: fit-content !important;
    //width: -webkit-fit-content !important;
    //width: -moz-fit-content !important;
	height: 100%;
	
	/* - Spacing - */
	padding: 2em !important;
	margin: 0 !important;
}

#more-work .portfolio-items .work-info h3 {
	
	/* - Style - */
	color: var(--white);
	font-size: 1rem !important;
	font-weight: 500 !important;
	line-height: 1.3em !important;
	letter-spacing: 0.1rem !important;
    text-transform: uppercase !important;
    
	color: var(--white) !important;
	//background-color: var(--light-bg);
	box-shadow: 0.7rem 0 0px 0px var(--accent1), -0.7rem 0 0px 0px var(--accent1);
	
	/* - Layout - */
	display: flex !important;
    z-index: 999;
    max-width: fit-content !important;
    max-width: -webkit-fit-content !important;
    max-width: -moz-fit-content !important;
	
	/* - Spacing - */
	margin: 0 !important;
	padding: 0.4em 0 !important;
}

#more-work .portfolio-items .work-item:hover h3 {
	
	/* - Style - */
	color: var(--white) !important;
	//background-color: var(--accent2);
	box-shadow: 1rem 0 0px 0px var(--accent2), -1rem 0 0px 0px var(--accent2);
}

#more-work .portfolio-items .work-info p {
	display: none !important;
}

#more-work .portfolio-items .work-item img {
	min-height: 100% !important;
	min-width: 100% !important;
	object-fit: cover;
}


/* --- Alt version --- */

#more-work .extra-link {
	display: flex;
	justify-content: center;
	align-items: center;
	border-radius: 0.4rem !important;
	//height: 240px !important;
}

#more-work .extra-link::before {
	
	/* - Style - */
	content: '';
	background-color: var(--accent2);
	opacity: 0.8;
	
	/* - Layout - */
	position: absolute;
	width: 100%;
	height: 100%;
	
	/* - Animation - */
	transition: opacity 0.45s cubic-bezier(.15,.75,.5,1) 0s !important;
}

#more-work .extra-link:hover {
	background-size: 1.1rem;
}

#more-work .extra-link h4 {
	
	/* - Style - */
	color: var(--white);
	font-size: 1.5rem !important;
	font-weight: 500 !important;
	line-height: 1.3em !important;
	letter-spacing: 0.1rem !important;
    text-transform: uppercase !important;
    
	color: var(--accent2) !important;
	background-color: var(--light-bg);
	box-shadow: 0.45rem 0 0px 0px #fff, -0.45rem 0 0px 0px #fff;
	
	/* - Layout - */
	display: flex !important;
	justify-content: center;
	width: fit-content !important;
    z-index: 999;
	
	/* - Spacing - */
	margin: 0 !important;
	padding: 0.4em 0;
}


@media only screen and (min-width: 1000px) {
	
	#more-work .portfolio-items .work-item { height: 15em; }
	
	#more-work .portfolio-items .work-info h3 { font-size: 1.2rem !important; }
	
}


/* =============================
   --- CONTACT ME : OCT 2019 --- */


#contact-me {
	//padding-left: 1% !important;
	//padding-right: 1% !important;
	padding: 0 !important;
}

#contact-me .contact-box {
	background-color: var(--accent2) !important;
	padding: 3em 3em 2.5em !important;
	border-radius: 0.4em !important;
	margin: 0 !important;
	//border: 1px solid var(--light-bg);
}

#contact-me .wpb_text_column {
	max-width: none !important;
}

#contact-me p {
	color: var(--dark-text-1) !important;
	font-size: 1.4rem !important;
	margin-bottom: 1.5em !important;
}

#contact-me .contact-buttons {
	display: flex;
	justify-content: center;
	flex-direction: row;
	margin: auto;
}

#contact-me a, #footer-outer #contact-me a.nectar-button {
	text-transform: uppercase !important;
	font-weight: 600 !important;
	letter-spacing: 0.05rem !important;
	margin: 1em;
	width: 160px;
	border-width: 3px !important;
	border-color: var(--light-bg) !important;
	//border: none !important;
	//background-color: var(--accent2) !important;
	color: var(--dark-text-1) !important;
}

#contact-me a:hover, #footer-outer #contact-me a.nectar-button:hover, #contact-me a:hover:focus, #footer-outer #contact-me a.nectar-button:active:hover {
	background-color: var(--light-bg) !important;
	color: var(--accent1) !important;
}

#footer-widgets .container .col {
	margin: 0 !important;
}


/* =================
   --- COPYRIGHT --- */

/* Social */

#footer-outer #copyright .social {
	margin: 2em auto 4em !important;
}

#footer-outer #copyright .social li a i {
	color: var(--accent2) !important;
}

#footer-outer #copyright .social li a i::after {
	border: none !important;
}

#footer-outer #copyright .social li a:hover i {
	//background-color: var(--light-bg) !important;
	color: var(--accent1) !important;
	font-size: 2rem !important;
}


/* --- Sign-off --- */

#footer-outer #copyright #signoff {
	display: flex !important;
	flex-direction: column;
	align-items: center !important;
}

/* --- Logo --- */

#footer-outer #copyright #signoff #endlogo {
	text-align: center;
	width: 60px;
	height: 80px;
	//background-color: var(--accent1);
	margin-bottom: 1em;
}

/* --- Roles --- */
#footer-outer #copyright #signoff ul {
	margin-bottom: 1em !important;
	display: flex;
	flex-direction: column;
}

#footer-outer #copyright #signoff ul li {
	
	/* - Style - */
	color: var(--text-2) !important;
	font-size: 0.7rem !important;
	font-weight: 500 !important;
	letter-spacing: 0.1em !important;
	text-transform: uppercase;
	
}

@media only screen and (min-width: 690px) {
	
	#footer-outer #copyright #signoff ul {
		display: block;
	}
	
	#footer-outer #copyright #signoff ul li:not(:first-child)::before {
		content: '•';
		margin-right: 2em;
	}
	
}

/* --- Legal --- */

#footer-outer #copyright p {
	font-size: 0.7rem !important;
	color: var(--text-3) !important;
}


/* ====================================
/* --- WORK IN PROGRESS : JULY 2020 --- */

#work-in-progress {
	background-color: rgba(0,0,0,0.03);
	border: solid 2px var(--accent3);
	border-radius: 0.3em;
	display: flex;
	//max-width: 30em !important;
	margin: 5em auto 1em !important;
	padding: 0 !important;
	box-shadow: 0px 5px 25px var(--accent1-lighttint)/*#0003*/, 0px 3px 3px var(--accent1-lighttint)/*#0001*/;
	overflow: hidden;
}

#work-in-progress .heading {
	background-color: var(--accent3);
	border-bottom: solid 1px #0001;
	border-bottom: solid 2px var(--accent3);
	display: flex;
	align-items: center;
	padding: 0.5em 0.8em;
	margin: 0 !important;
}

#work-in-progress .heading h5 {
	color: var(--accent4) !important;
}

#work-in-progress .heading::before {
	content: "⚠️";
	margin-right: 0.5em;
	font-size: 1.1rem !important;
	font-style: normal;
}

#work-in-progress .wip-message {
	padding: 1.2em !important;
}

#work-in-progress p {
	font-size: 0.9rem !important;
	font-weight: 400 !important;
	font-style: italic;
	color: var(--text-1) !important;
	margin: 0 !important;
}

#work-in-progress p:not(:last-child) {
	padding-bottom: 0.7em !important;
}

#work-in-progress .buttons {
	padding: 0.6em 1.2em 1.2em !important;
}

#work-in-progress a {
	text-transform: uppercase !important;
	font-weight: 600 !important;
	letter-spacing: 0.05rem !important;
	margin: 0;
	border: solid 3px var(--accent1-tint) !important;
	color: var(--accent1) !important;
}

#work-in-progress a:not(:last-child) {
	margin-right: 1.5em;
	margin-bottom: 1em;
}

#work-in-progress a.light {
	border: solid 3px var(--text-5) !important;
	color: var(--text-2) !important;
}

#work-in-progress a:hover {
	border-color: var(--accent2) !important;
	color: var(--accent2) !important;
}

/*
#work-in-progress a.light:hover {
	border-color: var(--text-3) !important;
	background-color: var(--text-3) !important;
	color: white !important;
}
*/


@media only screen and (min-width: 480px) {
	
	#work-in-progress a { margin-bottom: 0 !important; }
	
}


/* ===============================
/* --- TL;DR : JULY 2020 --- */
/*
⚡︎
HIGH VOLTAGE SIGN
Unicode: U+26A1 U+FE0E, UTF-8: E2 9A A1 EF B8 8E*/

#tldr .vc_column-inner > .wpb_wrapper {
	padding: 2em;
	background-color: var(--accent3-lighter) !important;
	border-radius: 0.5em;
}

#tldr h4 {
	margin-top: 0em !important;
	color: transparent !important;
	text-shadow: 0 0 0 var(--accent1) !important;
}

/*#tldr h4::before {
	content: "TL\26A1 DR";
	color: transparent;
	text-shadow: 0 0 0 var(--accent1);
}*/


#tldr ul {
	padding-bottom: 0 !important;
}



/* ===============================
   --- DOWNLOAD BOX : OCT 2019 --- */

#downloads {
	//padding-left: 1% !important;
	//padding-right: 1% !important;
}

#downloads .wpb_wrapper > .wpb_row {
	padding-top: 0 !important;
	padding-bottom: 0.5em !important;
}

#downloads .wpb_text_column {
	text-align: left;
	padding: 0 !important;
	margin: 0 !important;
	//margin-bottom: 0.5em !important;
}

#downloads p:last-child {
	margin-bottom: 0 !important;
}

#downloads .requirements p {
}

#downloads .warning {
}

#downloads .warning p {
	color: rgba(255,0,0,0.5) !important;
	padding: 0 !important;
	margin: 0 !important;
	font-style: italic;
}

#downloads .download-box {
	background-color: var(--accent1-lighttint) !important;
	padding: 1em !important;
	border-radius: 0.4em !important;
	overflow: visible !important;
}

#downloads .download-box .wpb_wrapper {
	display: flex !important;
	flex-direction: row !important;
	justify-content: space-between !important;
	align-items: center !important;
}

#downloads .download-box p {
	font-size: 1rem !important;
	color: var(--accent1-light) !important;
	text-align: left;
	margin: 0 !important;
	font-weight: 600 !important;
}

#downloads .download-box p em {
	opacity: 0.5 !important;
	font-weight: 500 !important;
	font-style: italic !important;
}

#downloads .download-box a {
	text-transform: uppercase !important;
	font-weight: 700 !important;
	letter-spacing: 0.1rem !important;
	margin: 0;
	border: 2px solid var(--accent2) !important;
	color: var(--accent2) !important;
}

#downloads .download-box a:hover {
	background-color: var(--accent2-tint) !important;
	color: var(--dark-text-0) !important;
}

#downloads .download-box a.disabled {
	text-transform: uppercase !important;
	font-weight: 700 !important;
	letter-spacing: 0.1rem !important;
	margin: 0;
	border: none;
	background-color: var(--accent1-light) !important;
	color: var(--dark-text-1) !important;
}

#downloads .download-box a.disabled:hover {
	color: var(--dark-text-1) !important;
}

#downloads .heading::after {
	content: 'Requirements: VR-ready PC and PC VR headset (tested on Oculus Rift CV1 and Oculus Quest via link cable).';
	color: var(--text-2);
	font-size: 0.8rem;
	font-weight: 400;
	display: block;
	margin-bottom: 2em;
}

#downloads::after {
	content: 'Warning: These are in-progress builds and have not been fully tested or optimised and therefore may be prone to bugs or broken content.';
	color: var(--accent2-light);
	font-size: 0.8rem;
	font-weight: 500;
}



/* =======================
   --- WPU Like button --- */

.wpulike {
	padding: 0.8em 0.5em 0.8em 1.2em !important;
	//padding-top: 0.8em !important;
	//padding-left: 0.5em !important;
	max-width: 800px;
	margin: 5em auto 0 !important;
	//background-color: var(--accent3-lighttint);
	border: 2px solid var(--accent3-tint);
	//border-top: 2px solid var(--text-4);
	//box-shadow: 0px 2px 4px 0px rgba(0,0,0,0.1), 0px 4px 12px 1px rgba(0,0,0,0.15);
	border-radius: 0.4em;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
}

.wpulike::before {
	display: inline-flex;
	white-space: nowrap;
	content: 'Did you find this interesting?';
	font-weight: 600 !important;
	font-size: 0.9rem !important;
	color: var(--accent3) !important;
	margin-right: 1em;
}



.wpulike button {
	align-self: flex-end;
}

.wpulike .wp_ulike_is_unliked .count-box {
	color: var(--accent3);
}

.wpulike .wp_ulike_is_liked .count-box {
	color: var(--accent2);
}

.wpulike-notification .wpulike-message {
	border-radius: 0.4em !important;
}

.wpulike-notification .wpulike-message::before {
	display: flex;
	font-family: 'Material Icons';
	font-size: 1.6rem;
	text-align: center;
	justify-content: center;
	align-items: center;
	//background-size: 60%;
	width: 40px;
}

.wpulike-notification .wpulike-message.wpulike-success {
	background-color: var(--accent3);
}

.wpulike-notification .wpulike-message.wpulike-success::before {
	content: 'sentiment_satisfied';
	background-image: none;
}

.wpulike-notification .wpulike-message.wpulike-error {
	background-color: var(--accent2);
}

.wpulike-notification .wpulike-message.wpulike-error::before {
	content: 'sentiment_dissatisfied';
	background-image: none;
}



/* ==================
   --- Dark theme --- */

body.dark, body.dark p {
	color: var(--dark-text-1) !important;
}

body.dark .page-header-wrap, body.dark .container-wrap, body.dark #footer-outer, body.dark #footer-outer #copyright {
    background-color: #2A2732 !important;
}

body.dark .comment, body.dark del {
	//color: var(--dark-text-3) !important;
	background-image: linear-gradient(transparent 30%, var(--accent5-lighttint) 30%, var(--accent5-lighttint) 80%, transparent 80%);
	background-image: -moz-linear-gradient(transparent 30%, var(--accent5-lighttint) 30%, var(--accent5-lighttint) 80%, transparent 80%);
	background-image: -webkit-linear-gradient(transparent 30%, var(--accent4-lightertint) 30%, var(--accent4-lightertint) 80%, transparent 80%);
}


/* Download box */

body.dark #downloads .heading::after {
	color: var(--dark-text-2);
}

body.dark #downloads::after {
	color: var(--accent2-alttint);
}


/* Footer */

body.dark #footer-outer #copyright #signoff ul li {
	color: var(--dark-text-2) !important;
}

body.dark #footer-outer #copyright p {
	color: var(--dark-text-3) !important;
}