/*
	(c)2012 - visuallizard.com

	Mobile styles using Media Queries
*/

/* Color declarations */
:root {
	--red: #c01327;
	--dkred: #721922;
	--peach: #f58d77;
	--white: #ffffff;
	--black: #000000;
}

/* !Media Queries ============================== */

.mobile-menu-toggle { display: none; }

/* Less than 1400 (devices and browsers) */
@media only screen and (max-width: 1400px) {

}

/* Smaller than 1200 (devices and browsers) */
@media only screen and (max-width: 1200px) {

}

/* Smaller than standard 1100 (devices and browsers) */
@media only screen and (max-width: 1100px) {
	.container { width: 100%; }
	section > div.container { width: 100%; padding: 0 1rem; }
	.container#sector-success,
	.container#sector-partnerships,
	.container#sector-stories,
	.container#fast-facts,
	.container#sector-revenues,
	.container#sector-research,
	.container#sector-network,
	.container#digital-media-tax-incentives { width: 100%; padding: 1rem; }
}

/* All Mobile Sizes (devices and browser) */
@media only screen and (max-width: 800px) {

	h1 { font-size: 3.000rem; }
	h2 { font-size: 1.750rem; }
	h3 { font-size: 1.250rem; }
	h4 { font-size: 1.125rem; }
	h5 { font-size: 1.125rem; }
	h6 { font-size: 1.000rem; }

	body.home nav, body.campaign-2025 nav,
	body.investment-opportunities nav,
	body.yes-investors nav,
	body.yes-winnipeg-initiative nav { position: relative; }

	nav { width: 100%; margin: 0; }
	nav:after,
	body.home nav:after,
	body.campaign-2025 nav:after,
	body.investment-opportunities nav:after,
	body.yes-investors nav:after { display: none; }

	/* Mobile menu toggle */
	nav .mobile-menu-toggle {
		position: relative;
		padding-left: 1.25em;
		background: transparent;
		display: block;
		font-size: 16px;
		line-height: 16px;
		position: absolute;
		top: 12px;
		right: 20px;
		margin: 0;
		opacity: 1;
	}
	nav .mobile-menu-toggle:before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 2em;
		height: 3px;
		border-top: 9px double #fff;
		border-bottom: 9px double #fff;
	}
	nav .container > ul.nav_1 {
		display: block;
		position: absolute;
		float: none;
		top: 0;
		left: -999rem;
		width: 100%;
		padding: 50px 0 0 0;
		margin: 0;
		background: var(--black);
		color: var(--white);
		transition: all 0.5s ease;
	}
	nav ul { float: none; }
	nav.show .container > ul.nav_1 {
		left: 0;
	}
	nav ul.nav_1 li,
	nav ul.nav_1 li#nav_li_item_171,
	nav ul.nav_1 li#nav_li_item_173,
	nav ul.nav_1 li#nav_li_item_191,
	nav ul.nav_1 li#nav_li_item_259 { display: block; clear: both; }

	nav.show ul li.page-type-node:after,
	nav.show ul li.page-type-node.at.open:after {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		right: 10px;
		padding: 0;
		margin: -5px 0 0 0;
		border-top: 10px solid #fff;
		border-left: 5px solid transparent;
		border-right: 5px solid transparent;
		transform: rotate(90deg);
		-webkit-transition: all 0.5s ease;
		-moz-transition: all 0.5s ease;
		transition: all 0.5s ease;
	}
	nav.show ul li.page-type-node.open:after,
	nav.show ul li.page-type-node.at:after { transform: rotate(0deg); }

	nav ul.nav_1 > li > ul,
	nav.show ul.nav_1 >li.at.open > ul {
		display: block;
		position: relative;
		width: 100%;
		height: 0;
		opacity: 0;
		overflow: hidden;
		transition: all 0.5s ease;
	}
	nav ul.nav_1 > li > ul.on,
	nav.show ul.nav_1 > li.at > ul {
		height: auto;
		opacity: 1;
		overflow: visible;
	}

	body.home nav { background: var(--red); }
	body.home nav h1 .logo,
	body.campaign-2025 nav h1 .logo,
	body.investment-opportunities nav h1 .logo,
	body.yes-investors nav h1 .logo { background-image: url("../../../img/v2025/logo-wedt-white.svg"); }
	body.home nav ul li a,
	body.campaign-2025 nav ul li a,
	body.investment-opportunities nav ul li a,
	body.yes-investors nav ul li a {
		padding: 1rem;
		text-align: left;
		color: var(--white);
	}

	#header ul.secondary-nav { width: 100%; }
	#header ul.secondary-nav li { display: none; }
	#header ul.secondary-nav li.search { display: block; max-width: 100%; }

	#edw-home-banner > h2 { top: 1.5rem; bottom: auto; padding: 0 3rem; font-size: 2rem; line-height: 0.9; }
	#edw-home-banner ul.banners li div.banner-copy { width: 100%; bottom: 1rem; padding: 0 2rem; }
	#edw-home-banner ul.banners li div.banner-copy h3 { font-size: 1.125rem; }
	.slick-slide img { height: auto; }

	section#economic-indicators .indicator-set ul li h3.title { font-size: 2.25rem; }
	section#economic-indicators .indicator-set ul li h3.statistic { font-size: 5rem; }
	section#economic-indicators .indicator-set ul li h3.statistic span { font-size: 4rem; }
	section#economic-indicators .indicator-set ul li p { width: 80%; margin: 0 10%; }

	section#localdata .localdata-set h4 { width: 90%; margin: 0 5%; }

	main#content > section.head { padding: 1.5rem 0 3rem 0; }
	h2.page-heading { font-size: 1.75rem; }
	h2.page-heading:after { display: none; }

	div.industry-set div.industry { flex: 1 0 32%; max-width: 50%; }

	#subscribe .container div.col { flex: 1 0 49%; max-width: 100%; }


}

/* Mobile Portrait Size to Mobile Landscape Size (devices and browsers) */
@media only screen and (max-width: 670px) {

	.cke div.c1,
	.cke div.c2,
	.cke div.c3,
	.cke div.c4,
	.cke div.c5,
	.cke div.c6 { flex: 0 0 100%; max-width: 100%; }

	#header #search-block.active { right: 0; width: 100%; }

	#home-banner { display: none; }

	#whats-new .container .feature-posts div.feature-post { flex: 0 0 100%; max-width: 100%; }
	#silos .container ul.silo-set li { flex: 0 0 100%; max-width: 100%; }

	ol#breadcrumbs { display: none; }

	.c2025-section#yw-intro h2.intro-heading:after,
	.investlevel-section#yw-intro h2.intro-heading:after { display: none; }

	.investor-tier#tier_0 .ywinvestor { flex-basis: 100%; max-width: 100%; }
	.investor-tier#tier_0 .ywinvestor,
	.investor-tier#tier_1 .ywinvestor,
	.investor-tier#tier_2 .ywinvestor,
	.investor-tier#tier_3 .ywinvestor,
	.investor-tier#tier_4 .ywinvestor { padding: 1em; }
	.investor-tier#tier_4 .ywinvestor { padding: 0.5em; }
	.investor-tier#tier_4 .ywinvestor > p { font-size: 1.125rem; }
	.investor-tier#tier_1 .ywinvestor .brief,
	.investor-tier#tier_2 .ywinvestor .brief,
	.investor-tier#tier_3 .ywinvestor .brief,
	.investor-tier#tier_4 .ywinvestor .brief { top: -1px; left: -1px; bottom: auto; right: auto; width: 327px; }
	.investor-tier#tier_1 .ywinvestor:nth-child(2n) .brief,
	.investor-tier#tier_2 .ywinvestor:nth-child(2n) .brief,
	.investor-tier#tier_3 .ywinvestor:nth-child(2n) .brief,
	.investor-tier#tier_4 .ywinvestor:nth-child(2n) .brief { top: -1px; left: auto; bottom: auto; right: -1px; width: 327px; }
	.investor-tier .ywinvestor .brief p { font-size: 0.875rem; }

	ul.homeruns li { float: left; width: 100%; }
	ul.bih-nav { display: block; }
	ul.bih-nav li,
	ul.bih-nav li:first-of-type { width: 100%; margin: 0 0 0.5em 0; }

	#subscribe .col { width: 100%; margin: 0; }

	form.sv_api_form table tr td,
	form.sv_api_form table tr td.sv_api_field_disp,
	form.sv_api_form table tr td.sv_api_field_val { display: block; width: 100%; }

	div.blog-set div.post,
	div.blog-set.first div.post:first-of-type { width: 100%; min-height: 50px; margin: 0 0 15px 0; }
	div.blog-set.first div.post:first-of-type h3 { padding: 15px; font-size: 18px; line-height: 20px; }
	div.blog-set div.post.subscribe-block .input.text { margin: 0 0 15px 0; }
	div.blog-set div.post.subscribe-block div.submit { position: relative; padding: 0; }
	.js #more-posts .pagination > a.more-posts { width: 100%; margin: 0; }

	div.post-info div.date-category { width: 100%; font-size: 18px; line-height: 24px; }
	div.post-info div.date-category span.author { padding-right: 15px; }
	div.post-info ul.social-share { clear: both; width: 50%; margin: 15px 25%; }

	.sidebar div.staffer.connect,
	.sidebar div.staffer.connect:first-of-type { float: left; width: 100%; margin: 0 0 10px 0; }
	.sidebar div.staffer.connect .staffer-image { width: 32%; }
	.sidebar div.staffer.connect .contact-info { width: 68%; }

	div.sector-success div.sectorsuccess-stat,
	div.sector-success div.sectorsuccess-desc { width: 100%; padding: 0; }
	div.sector-success div.sectorsuccess-stat img { max-width: 200px; margin: 0 auto 30px auto; }

	.container#fast-facts > h3 span, .container#sector-revenues > h3 span { text-align: left; }
	.container#fast-facts > h3 span, .container#sector-revenues > h3 span p { font-size: 14px; margin: 0; }

	.container#fast-facts div.industry-details ul.infographic-list { display: block; }
	.container#fast-facts div.industry-details ul.infographic-list li:nth-child(4n+1),
	.container#fast-facts div.industry-details ul.infographic-list li:nth-child(4n+2),
	.container#fast-facts div.industry-details ul.infographic-list li:nth-child(4n+3),
	.container#fast-facts div.industry-details ul.infographic-list li:nth-child(4n+4) { width: 100%; }
	.container#sector-revenues div.industry-details ul.infographic-list { display: block; }
	.container#sector-revenues div.industry-details ul.infographic-list li:nth-child(4n+1),
	.container#sector-revenues div.industry-details ul.infographic-list li:nth-child(4n+2),
	.container#sector-revenues div.industry-details ul.infographic-list li:nth-child(4n+3),
	.container#sector-revenues div.industry-details ul.infographic-list li:nth-child(4n+4) { width: 100%; }

	ul.company { width: 100%; margin: 0; }

	form.toolkit-filter { position: relative; top: auto; right: auto; width: 100%; margin: 0 0 15px 0; }
	div.toolkit-set div.toolkit-item { width: 100%; margin: 0 0 15px 0; }

	div.toolkit-set div.toolkit-item div.item-info { min-height: 280px; }

	.c2025-section#yw-intro,
	.investlevel-section#yw-intro { padding: 0; margin: 0; }
	.c2025-section div.goals,
	.c2025-section div#latest-articles { flex-wrap: wrap; }
	.c2025-section div.goals div.goal,
	.c2025-section div#latest-articles article { flex-basis: 100%; max-width: 100%; margin: 0 0 0.5em 0; }
	.c2025-section div.benefits div.benefit,
	.investlevel-section div.benefits div.benefit { flex-basis: 100%; max-width: 100%; margin: 0 0 0.5em 0; }
	.c2025-section div.investors > img,
	.investlevel-section div.investors > img { width: 50%; margin: 0 25% 1em 25%; }
	.c2025-section div.investors div.investor-banners,
	.investlevel-section div.investors div.investor-banners { width: 70%; margin: 0 15%; }

	.investor-level h2.investor-heading { top: auto; width: 100%; padding: 0.5em 0; margin: 0 0 0.5em 0; font-size: 20px; }
	.investor-level h2.investor-heading:before,
	.investor-level h2.investor-heading:after { display: none; }
	.investor-level div.level-benefit ul li { flex-basis: 100%; max-width: none; }

	.investlevel-section div.staff-block { flex-wrap: wrap; }
	.investlevel-section div.staff-block div.staffer.connect { flex-basis: 100%; max-width: none; margin: 0 0 0.5em 0; }

	#success-block .investor-feature div.investor-quote p { font-size: 0.875rem; }

	#content.industry .container ul#industry-nav { display: none; }

	#content #banner-block { margin: 0 0 1.5rem 0; }
	#content > .container .main,
	#content .container .sidebar { flex: 0 0 100%; max-width: 100%; padding: 1rem 0; }
	#content .container .sidebar { margin-bottom: 1.5rem; }
	#content > .container .main *:first-child,
	#content .container .sidebar *:first-child { margin-top: 0; }

}

@media only screen and (max-width: 520px) {
	#success-block .container { padding: 0; }
	#success-block h3 { width: 50%; margin: 0; }
	#success-block .investor-feature { max-height: none; }
	#success-block .investor-feature img { width: 100%; margin: 0 0 1em 0; }
	#success-block .investor-feature div.investor-quote { float: left; width: 100%; padding: 1em 1em 3em 1em; }
	#success-block .investor-feature div.investor-quote:before { display: none; }

	#related,
	#related-block { display: none; }
	.yw div.testimonial img,
	.yw div.testimonial iframe { width: 100%; margin: 0 0 10px 0; }
	.yw div.testimonial iframe { max-height: 200px; }
	.yw div.testimonial div.quote { clear: both; float: left; width: 100%; margin: 0; }

	section.careers#introduction .container { padding: 2rem; }
	section.careers#icons .container div.benefit-item { flex-basis: 49%; max-width: 49%; }
	section.careers#icons .container div.benefit-item:nth-child(n+9),
	section.careers#icons .container div.benefit-item:nth-child(n+10) { border-bottom: 1px solid #c01327; }
	section.careers#icons .container div.benefit-item:nth-child(n+11) { border: none; }

	div.career-list div.career div.career-desc,
	div.career-list div.career p.deadline,
	div.career-list div.career div.actions { flex-basis: 100%; max-width: 100%; text-align: center; }

}

@media only screen and (max-width: 420px) {

}
