/*
	(c)2012 - visuallizard.com

	General Layout Styles.
	Sets major blocking (and minor styles) to general elements in the template.
	All can be removed and started from scratch or elements can be adjusted individually.
*/
* { box-sizing: border-box; }

.cke { display: flex; flex-wrap: wrap; padding: 0; }
#introduction .cke { border: none; }
div#weglot-switcher-1 { display: none; }


div#loader {
	display: block;
	position: fixed;
	z-index: 1000;
	top: 0;
	width: 100%;
	height: 100vh;
	background-color: rgba(0,0,0,1);
	background-image: url("../../../img/fdi/loader.svg");
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 15%;
	transition: all 0.5s linear;
}
div#loader.fadeout {
	opacity: 0;
	z-index: -1;
	transition-delay: 0.5s;
}
a#to-top {
	display: block;
	position: fixed;
	z-index: 1;
	bottom: 1rem;
	right: 1rem;
	width: 60px;
	height: 60px;
	border-radius: 100%;
	text-indent: -9999em;
	background: #e6172f url("../../../img/fdi/chevron-up-solid.svg") no-repeat center center;
	background-size: 24px 24px;
	color: #fff;
}
div#sf-form {
	display: block;
	position: fixed;
	z-index: -1;
	top: 0;
	width: 100%;
	height: 100vh;
	padding: 0;
	text-align: center;
	opacity: 0;
	background: rgba(0,0,0,1);
	transition: all 1s linear;
}
div#sf-form.show {
	z-index: 100;
	opacity: 1;
	overflow: scroll;
}
	div#sf-form div.container {
		display: flex;
		position: relative;
		justify-content: center;
		align-items: flex-start;
		height: 100vh;
		padding: 3rem 0;
	}
	div#sf-form a.close {
		display: block;
		position: fixed;
		top: 1rem;
		right: 1rem;
		z-index: 1000;
		padding: 0.5rem;
		opacity: 1;
		background: #000;
		color: #fff;
	}

.container {
/*
	Set site width only here and use this class to centre the content in browser window.
	Default width is 960px and can be changed in skeleton.css to maintain responsiveness.
*/
	width: 100%;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0;
	position: relative;
}



a#mn_open { display: none; }
#mobile-nav { display: none; }


/* Header */
header {
	display: flex;
	position: fixed;
	z-index: 10;
	justify-content: flex-start;
	align-items: center;
	column-gap: 10%;
	flex-wrap: wrap;
	width: 100%;
	padding: 1rem 2rem;
	background: #000;
}
	header h1 {
		display: block;
		position: relative;
		flex: 1 0 7%;
		max-width: 10%;
		height: 70px;
		padding: 0;
		margin: 0;
	}
		header h1 a {
			display: block;
			position: absolute;
			top: 0;
			left: 0;
			bottom: 0;
			right: 0;
			text-indent: -9999em;
			background: url("../../../img/logo-wpg-white.svg") no-repeat center center;
			background-size: contain;
		}




/* !navigation styles */
nav {
	display: block;
	position: relative;
	flex: 1 0 65%;
	max-width: 65%;
	padding: 0;
	margin: 0;
}
	nav ul.nav_1 {
		display: flex;
		position: relative;
		justify-content: flex-start;
		flex-wrap: nowrap;
		column-gap: 0.625rem;
		width: 100%;
		padding: 0;
		margin: 0;
		list-style: none;
		font-size: 1rem;
		font-weight: 400;
		text-transform: uppercase;
	}
		nav ul.nav_1 li {
			display: block;
			position: relative;
			flex-grow: 1;
			padding: 0;
			margin: 0;
		}
			nav ul.nav_1 li a {
				display: block;
				position: relative;
				width: 100%;
				padding: 10px 0;
				margin: 0;
				text-align: center;
				text-decoration: none;
				letter-spacing: 0.5px;
				color: #ffffff;
			}
			nav ul.nav_1 > li:hover > a,
			nav ul.nav_1 > li.at > a { background: #e6172f ; color: #ffffff; }




/* ! Content area styles */
div.content {
	display: block;
	position: relative;
	padding: 3rem 0;
	margin: 0;
}
div.content#introduction {

}
	div.content#introduction > div#top {
		display: block;
		position: relative;
		width: 100%;
		padding: 145px 0 0 0;
	}
	div.content#introduction h1 {
		display: flex;
		position: relative;
		justify-content: center;
		align-items: center;
		column-gap: 1rem;
		margin: 0;
		font-size: 5rem;
		text-align: center;
		text-transform: uppercase;
		letter-spacing: 1px;
		color: #fff;
	}
	div.content#introduction h1 span {
		display: inline;
		text-shadow:
			-1px -1px 0 #fff,
			1px -1px 0 #fff,
			-1px 1px 0 #fff,
			1px 1px 0 #fff;
		color: #000;
	}
	div.content#introduction h1 > img {
		display: block;
		flex: 1 0 50px;
		max-width: 62px;
		padding: 0;
	}
	div.video-placeholder {
		display: block;
		position: relative;
		width: 100%;
		min-height: 50vh;
		margin: 60px 0 0 0;
	}
		div.video-placeholder video {
			display: block;
			position: relative;
			width: 100%;
			height: auto;
		}
section {
	display: block;
	position: relative;
	padding: 73px 0;
	margin: 0;
}

p.section-descriptor {
	text-transform: uppercase;
	margin: 0 0 0.5rem 0;
}
div.heading {
	display: flex;
	position: relative;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	width: 100%;
	column-gap: 1%;
	row-gap: 1rem;
	padding: 0;
	margin: 0 0 3rem 0;
}

section#tax-benefits {
	opacity: 0;
	transition: all 0.5s ease;
}
section#tax-benefits.show {
	opacity: 1;
	background: #040404;
}
	section#tax-benefits h2.section-heading {
		display: block;
		flex: 0 0 85%;
		max-width: 85%;
		margin: 0;
		margin-left: -2rem;
		opacity: 0;
		transition: all 1s ease;
	}
	section#tax-benefits.show h2.section-heading {
		margin-left: 0;
		opacity: 1;
	}
	section#tax-benefits a.button {
		z-index: 1;
		margin: 0;
		margin-right: -2rem;
		opacity: 0;
		transition: all 0.5s ease;
	}
	section#tax-benefits.show a.button {
		margin-right: 0;
		opacity: 1;
	}

h2.section-heading {
	margin: 0;
	font-size: 3rem;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 2px;
}
h2.section-heading span {
	text-shadow:
		-1px -1px 0 #fff,
		1px -1px 0 #fff,
		-1px 1px 0 #fff,
		1px 1px 0 #fff;
	color: #000;
}
div.advantages {
	display: flex;
	justify-content: center;
	align-items: stretch;
	flex-wrap: wrap;
	column-gap: 2%;
	row-gap: 1.25rem;
	width: 100%;
	padding: 0;
	margin: 0;
}
	div.advantages figure {
		display: flex;
		position: relative;
		flex-direction: column;
		justify-content: flex-start;
		column-gap: 1rem;
		row-gap: 0;
		flex: 0 0 32%;
		max-width: 32%;
		padding: 0 0 1rem 0;
		margin: 0;
		text-align: center;
	}
		div.advantages figure img {
			display: block;
			position: relative;
			order: 0;
			width: 100%;
		}
		div.advantages figure h3 {
			display: block;
			position: relative;
			order: 2;
			padding: 0 1rem;
			margin: -1.5rem 0 0 0;
			font-size: 1.25rem;
		}
		div.advantages figure p {
			display: block;
			position: relative;
			order: 1;
			min-height: 100px;
			margin-top: -180px;
			padding: 0 2.5rem;
			font-weight: 700;
		}



div.separator {
    display: block;
    position: relative;
    max-width: 100%;
	padding: 0;
}
div.separator.destinations {
    padding: 73px 0;
}
div.separator.destinations > h2 {
    display: block;
    position: relative;
    width: 100%;
	font-size: 1.25rem;
	text-align: center;
	text-transform: uppercase;
	color: #e6172f;
}
div.separator.destinations > div.destination-set {
	display: block;
	position: relative;
	max-width: 100%;
	padding: 2rem 0 0 0;
	margin: 0;
	list-style: none;
	font-family: "digitalize", sans-serif;
	font-weight: 500;
	text-transform: uppercase;
}
	div.destination-set div {
		display: block;
		position: relative;
		padding: 0;
		font-size: 3rem;
		text-align: center;
		line-height: 1;
	}
	div.destination-set div:nth-child(2n+2) { font-size: 4.5rem; }
	div.destination-set div:nth-child(3n+1) { padding-top: 0.5rem; font-size: 3.5rem; }
	div.destination-set div:nth-child(4n) { padding-top: 1rem; font-size: 2.75rem; }
	div.destination-set div:nth-child(5n) { padding-top: 1.25rem; font-size: 4rem; }
	div.destination-set div:nth-child(2n+2) { color: #e6172f; }
		div.destination-set div a { color: inherit; }

div.separator.marquee > ul {
    display: block;
    position: relative;
    width: 100%;
    padding: 2rem 0;
    margin: 0;
    list-style: none;
    text-transform: uppercase;
}
    div.separator.marquee > ul li {
        position: relative;
        width: 100%;
        padding: 0;
        font-size: 700%;
        font-weight: 700;
        line-height: 1;
        text-align: center;
    }
    div.separator.marquee > ul li > strong {
        display: inline-block;
        position: relative;
        padding: 0 2rem;
    }
    div.separator.marquee > ul li span {
        text-shadow:
            -1px -1px 0 #fff,
            1px -1px 0 #fff,
            -1px 1px 0 #fff,
            1px 1px 0 #fff;
        color: #000000;
    }
    div.separator.marquee > ul li > img {
        display: inline-block;
        position: relative;
        float: right;
        max-height: 7rem;
    }



/* ! [ Living in Winnipeg ] */
section#live-thrive {}
section#live-thrive div.container {
	display: flex;
	position: relative;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
	column-gap: 4%;
	row-gap: 1.25rem;
	padding: 0;
}
section#live-thrive div.container > figure {
	display: block;
	position: relative;
	flex: 0 0 50%;
	max-width: 50%;
}
section#live-thrive div.container > div.description {
	display: block;
	position: relative;
	flex: 0 0 46%;
	max-width: 46%;
}
	section#live-thrive div.container > div.description h2 {
		font-size: 3rem;
		line-height: 1.25;
		text-transform: uppercase;
		padding-right: 30%;
		margin: 0 0 1.5rem 0;
	}
	section#live-thrive div.container > div.description ul {
		padding: 0 0 0 1.25rem;
		margin: 0 0 0 0.5rem;
		font-size: 1.5rem;
		font-weight: 600;
	}
		section#live-thrive div.container > div.description ul li {
			padding-left: 1.5rem;
			line-height: 2.25;
		}
		section#live-thrive div.container > div.description ul li::marker {
			font-size: 1.5rem;
			font-weight: 600;
			color: #e6172f;
		}
section#live-thrive div.container > div.quote {
	display: block;
	position: relative;
	padding: 3rem 6.5rem 0 6.5rem;
	text-align: center;
}
	section#live-thrive div.container > div.quote p {
		margin-bottom: 4rem;
		font-size: 1.75rem;
		font-weight: 500;
	}
	section#live-thrive div.container > div.quote > h3 {
		font-size: 1.5rem;
		text-transform: uppercase;
		color: #fff;
	}
		section#live-thrive div.container > div.quote > h3 span {
			font-size: 1rem;
			color: #e6172f;
		}



section#creative-industries {

}
	section#creative-industries div.container {
		display: flex;
		position: relative;
		justify-content: flex-start;
		align-items: flex-start;
		flex-wrap: wrap;
		column-gap: 2%;
		row-gap: 1.25rem;
		padding: 0;
	}
		section#creative-industries div.container aside {
			display: block;
			position: relative;
			flex: 0 0 38%;
			max-width: 38%;
		}
			section#creative-industries div.container aside ul {
				display: block;
				position: relative;
				width: 100%;
				padding: 0;
				margin: 2rem 0 0 0;
				list-style: none;
				text-transform: uppercase;
				font-size: 1.25rem;
			}
				section#creative-industries div.container aside ul li {
					margin: 0 0 2rem 0;
				}
				section#creative-industries div.container aside ul li a {
					display: block;
					position: relative;
					border-bottom: 1px solid transparent;
					line-height: 2;
					font-weight: 700;
					color: #ffffff;
					transition: all 0.5s ease;
				}
				section#creative-industries div.container aside ul li.active a {
					border-bottom: 1px solid #e6172f;
				}
				section#creative-industries div.container aside ul li a:after {
					content: "";
					display: block;
					position: absolute;
					top: 50%;
					right: 0;
					width: 24px;
					height: 24px;
					margin-top: -12px;
					background: url("../../../img/fdi/chevron-right-solid.svg") no-repeat center center;
					background-size: 16px 16px;
				}
		section#creative-industries div.container div.industry-set {
			display: block;
			position: relative;
			flex: 1 0 50%;
			max-width: 60%;
			min-height: 575px;
		}
			section#creative-industries div.container div.industry-set div.industry {
				display: block;
				position: absolute;
				z-index: -1;
				width: 100%;
				opacity: 0;
				transition: all 0.5s ease;
			}
			section#creative-industries div.container div.industry-set div.industry.show {
				z-index: 1;
				opacity: 1;
				transition-delay: 0.25s;
			}
				section#creative-industries div.container div.industry-set div.industry div.video-placeholder {
					min-height: 0;
					margin: 0 0 40px 0;
				}



section#get-in-touch {
	padding: 120px 0 80px 0;
}



section#successes {
	padding-bottom: 0;
	opacity: 0;
	transition: all 0.5s ease;
}
section#successes.show {
	opacity: 1;
	background: #040404;
}



/* !Footer layout styles	 */
footer {
	display: block;
	position: relative;
	align-self: flex-end;
	width: 100%;
	padding: 3rem 0;
	margin: 0;
	color: #fff;
}
	footer > .container {
		display: flex;
		position: relative;
		flex-wrap: wrap;
		justify-content: flex-start;
		column-gap: 2%;
		row-gap: 1.25rem;
		max-width: 1200px;
		padding: 0;
	}
		footer > .container div.col {
			display: block;
			position: relative;
			flex-basis: 32%;
			max-width: 32%;
			padding: 0;
			margin-bottom: 60px;
			color: #7d7d7d;
		}
			footer > .container div.col p { margin: 0; }
			footer > .container div.col a.logo {
				display: block;
				position: relative;
				width: 60%;
				height: 70px;
				text-indent: -9999em;
				background: url("../../../img/logo-wpg-white.svg") no-repeat center top;
				background-size: contain;
			}
			footer > .container div.col h2 {
				padding: 0;
				margin: 0 0 0.5rem 0;
				font-family: "Montserrat", sans-serif;
				font-size: 1.25rem;
				font-weight: 600;
				text-transform: uppercase;
			}
			footer > .container a { color: inherit; text-decoration: underline; }
			footer > .container div.col ul.social {
				display: block;
				position: relative;
				padding: 0;
				margin: 0;
				list-style: none;
			}
				footer > .container div.col ul.social li {
					display: block;
					position: relative;
					line-height: 1.5;
				}
					footer > .container div.col ul.social li a {
						display: flex;
						position: relative;
						justify-content: flex-start;
						align-items: center;
						column-gap: 1rem;
						width: 100%;
						padding: 0;
						margin: 0;
					}
						footer > .container div.col ul.social li a svg {
							display: block;
							position: relative;
							order: 1;
							flex: 0 0 36px;
							max-width: 36px;
						}
						footer > .container div.col ul.social li a span {
							display: block;
							position: relative;
							order: 0;
							flex: 1 0 60px;
							max-width: 80%;
							text-align: right;
						}
		footer > .container p.copyright {
			display: block;
			position: relative;
			flex: 0 0 100%;
			max-width: 100%;
			padding: 1rem 0 0 0;
			margin: 0;
			border-top: 1px solid #7c7c7c;
			font-weight: 600;
		}


/* Content layout (appearance) */
.content-display {

}
	.content-display:after { clear: both; }

	.content-display .content-block {
		width: 45%;
		margin: 0 2.5% 0 0;
	}

	/* 	single */
	.content-display.type-0 {

	}

	/* 	double */
	.content-display.type-1 .content-block {

	}

	/* double, wide-top */
	.content-display.type-2 .content-block:nth-child(3n+1) {
		width: 100%;
		margin: 0;
	}

	/* double, wide-bottom */
	.content-display.type-3 .content-block:nth-child(3n+3) {
		width: 100%;
		margin: 0;
	}


	/* triple */
	.content-display.type-4 .content-block {
		width: 30%;
		margin-right: 3%;
	}


/* Hide content that requires JavaScript unless JavaScript is running. */
body .requires-js { display: none; }