/* GLOBALS */

*{
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	outline: none;
	font-family: 'Roboto Condensed', sans-serif;
}

body{
	width: 100%;
	min-width: 320px;
	background: #eee url(media/background.png) center center repeat;
	z-index: -5;
	color: #2d2f32;
}

.print{
	display: none;
}

.relative{
	position: relative;
}

.none{
	display: none;
}

.nowrap{
	white-space: nowrap;
}

::selection {
	background: #3B2F81;
	color: #fff;
}

li{
	list-style: none;
}

.container{
	width: 100%;
	max-width: 1920px;
	min-width: 320px;
	margin: 0 auto;
	background-color: #fff;
}

	/* TOP SOCIAL */

	.top-social-container{
		width: 100%;
		min-width: 320px;
		background: #000;
		display: none;
	}

	.top-social{
		width: 80%;
		margin: 0 auto;
		min-width: 280px;
		padding: 15px 0;
	}

	.top-social-icons{
		z-index: 3;
		text-indent: -9999px;
		display: flex;
		justify-content: center;
	}

	/*.top-social-text{
		display: block;
		color: #fff;
		height: 30px;
		text-indent: 0;
		line-height: 30px;
		margin: 0 10px;
	}*/

	.top-social-icons a{
		display: block;
		z-index: 3;
		width: 30px;
		height: 30px;
		margin: 0 10px;
		background-repeat: no-repeat;
		background-size: 100%;
	}

	/* NAVIGATION */

	.navigation-container{
		background: linear-gradient(to bottom, rgba(0,0,0,.4), rgba(0,0,0,0));
		width: 100%;
		min-width: 320px;
		margin: 0 auto;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 5;
	}

		.navigation{
			width: 80%;
			min-width: 280px;
			margin: 0 auto;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 20px 0;
			width: 80%;
		}

			.logo{
				z-index: 3;
				display: block;
				width: 250px;
				height: 80px;
				text-indent: -9999px;
				background-image: url(media/logo.png?id=234234);
				background-size: 100%;
				background-repeat: no-repeat;

			}

			.social{
				display: flex;
				flex: 1;
				justify-content: flex-start;
				z-index: 3;
				text-indent: -9999px;
				margin:0 10px;
			}


			.social a{
				z-index: 3;
				display: block;
				width: 30px;
				height: 30px;
				margin: 0 10px;
				background-repeat: no-repeat;
				background-size: 100%;
			}

				.facebook{
					background-image: url(media/icon-facebook.png);
				}

				.instagram{
					background-image: url(media/icon-instagram.png);
				}

				.twitter{
					background-image: url(media/icon-twitter.png);
				}

				.youtube{
					background-image: url(media/icon-youtube.png);
				}

				.linkedin{
					background-image: url(media/icon-linkedin.png);
				}


			.menu{
				display: flex;
				justify-content: flex-end;
				z-index: 3;
			}

			.menu a{
				font-size: 1.2rem;
				padding: .6rem 1rem;
				margin: 0 .5rem;
				color: #fff;
				text-decoration: none;
				border-radius: .3rem;
				vertical-align: middle;
			}

				.menu .end{
					margin:0 0 0 .5rem;
				}

				.menu .green{
					background: #6CBE45;
				}

				.menu .purple{
					background: #3B2F81;
				}


			.burger{
				display: none;
				cursor: pointer;
			}

				.burger div{
					background-color: #fff;
					width: 25px;
					height: 3px;
					margin: .25rem 0;

				}


	/* LANDING */

	.landing{
		background-image: url(media/portrait-tablet.jpg);
		background-repeat: no-repeat;
		background-position: center center;
		background-size: cover;
		height: 900px;
		position: relative;
	}

		.slogan-container{
			width: 80%;
			min-width: 280px;
			height: 100%;
			margin: 0 auto;
			display: flex;
			justify-content: center;
			flex-direction: column;
		}

			.slogan{
				z-index: 5;
				width: 100%;
				text-shadow: 1px 2px 3px rgba( 0, 0, 0, .3);
				font-style: italic;
				color: #fff;
				font-weight: 700;
				font-size: 5.5rem;
				line-height: 5.2rem;
				}


		.landing-mobile-links{
			display: none;
			align-self: center;
			margin: 0 0 15px 0;
		}
			.landing-mobile-links ul{
				display: flex;
				padding: 20px 0;
			}

				.landing-mobile-links a{
					font-size: 1.2rem;
					padding: .6rem 1rem;
					color: #fff;
					text-decoration: none;
					border-radius: .3rem;
					vertical-align: right;
				}

					.landing-mobile-links .last{
						margin: 0 0 0 10px;
					}

					.landing-mobile-links .green{
						background-color: #6CBE45;
					}

					.landing-mobile-links .purple{
						background-color: #3B2F81;
					}

		.language{
			position: absolute;
			top: 25%;
			right: 0;
			color: #fff;
			z-index: 20;
			margin: 10px 0 10px 0;
		}

			.language-icons{
				display: flex;
				flex-direction: column;
				height: auto;
				position: relative;
			}

			.language-icons a{
				display: block;
				padding: 10px 20px 10px 10px;
				margin-bottom: 5px;
				font-size: 1.2rem;
				border-radius: .5rem 0 0 .5rem;
				text-decoration: none;
			}

				.language-icons a{
					background-color: #000;
					color: #fff;
				}

				.language-icons a:hover{
					background-color: #6CBE45;
				}

				.language-icons .active, .language-icons .active:hover{
					background-color: #ccc;
					color:#999;
				}

	/* CONTENT */

	h1{
		font-size: 3rem;
		font-weight: 700;
		font-style: italic;

	}

	h2{
		font-size: 1.8rem;
		font-weight: 700;
		font-style: italic;
	}

	p{
		font-size: 1.2rem;
		line-height: 1.8rem;
	}

	.meet-corrie{
		background-image: url(media/meet-corrie-stretch.jpg);
		background-repeat: no-repeat;
		background-position: center right;
		background-size: cover;
		position: relative;
	}

		.meet-corrie-wrap{
			width: 80%;
			margin: 0 auto;
			min-width: 280px;
			padding: 20px 0;
			display: flex;
			justify-content: center;
			flex-direction: column;
			height: 700px;
		}

		.meet-corrie-window{
			width: 70%;
		}

	/* YOUTUBE */


	.update{
		width: 80%;
		margin: 40px auto;
		position: relative;
	}
	.update iframe{
		width: 100%;
		height: 800px;
	}

	/* KEY ISSUES */

	.key-issues h1, .vote-now h1{
		font-size: 4rem;
		color: #3B2F81;
	}


	.key-issues a, .vote-now a{
		color: #2d2f32;
		text-decoration: underline;
	}

	.key-issues-wrap{
		width: 80%;
		margin: 0 auto;
		min-width: 280px;
		padding: 20px 0;
	}

		.key-issues-header{
			margin: 20px auto 50px auto;
			text-align: center;
			min-width: 280px;
			max-width: 700px;
		}

		.key-issues-flex{
			margin: 0 auto;
			padding: 0 0 0 0;
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
		}

			.key-issues .tile{
				background: #fff;
				padding: 15px;
				margin: 0 0 40px 0;
				border-radius: 1rem;
				width: 25%;
			}
				.key-issues .tile h2{
					line-height: 2rem;
					text-align: center;
					border-bottom: 1px solid #ddd;
					margin-bottom: 10px;
					padding: 10px 0;
				}

				.key-issues .tile p{
					font-size: 1.2 rem;
					padding: 10px 0;
				}


			.key-issues .icon{
				z-index: 3;
				display: block;
				width: 130px;
				height: 130px;
				background-repeat: no-repeat;
				background-size: 100%;
				margin: 0 auto;
			}

				.taxes .icon {
					background-image: url(media/issues-taxes.png);
				}

				.modernization .icon{
					background-image: url(media/issues-modernization.png);
				}

				.guardianship .icon{
					background-image: url(media/issues-guardianship.png);
				}

				.empathy .icon{
					background-image: url(media/issues-empathy.png);
				}

		.key-issues-footer{
			margin: 0 auto 20px auto;
			text-align: center;
			min-width: 280px;
			max-width: 700px;
			background: #f5f5f5;
		}

			.key-issues-footer-wrap{
				padding: 20px;
				font-style: italic;
			}

	/* END KEY ISSUES */

	/* VOTE NOW */

	.vote-now{
		background-color: #3B2F81;
		color: #fff;
	}

	.vote-now ::selection {
		background: #6CBE45;
		color: #fff;
	}

	.vote-now-wrap{
		width: 80%;
		margin: 0 auto;
		min-width: 280px;
		padding: 20px 0;
	}

		.vote-now-header{
			margin: 20px auto 50px auto;
			text-align: center;
			min-width: 280px;
			max-width: 700px;
		}

		.vote-now-flex{
			margin: 0 auto;
			padding: 0 0 0 0;
			display: flex;
			justify-content: space-between;
			flex-wrap: wrap;
		}

		.vote-now .tile{
			background: rgba( 255, 255, 255, .1);
			padding: 20px;
			margin: 0 0 40px 0;
			border-radius: .5rem;
			width: 32%;
			color: #fff;

		}
			.vote-now .step{
				margin: 0 40px 0 0;
			}

			.vote-now .tile a{
				color: #fff !important;
				background-color: rgba( 255, 255, 255, .2);
				text-decoration: none !important;
				padding: 2px 4px;
				white-space: nowrap;
			}

		.vote-now a{
			color: #fff;
			text-decoration: underline;
		}

		.vote-now .tile h2{
			line-height: 2rem;
			text-align: left;
			border-bottom: 1px solid rgba( 255, 255, 255, .1);
			margin-bottom: 10px;
			padding: 10px 0;
		}

		.vote-now .tile p{
			padding: 10px 0;
		}

		.vote-now-header h1{
			color: #fff;
		}

		.preview video{
			width:480px;
			height:250px;
		}

	.vote-now-footer{
		margin: 0 auto 20px auto;
		text-align: center;
		min-width: 280px;
		max-width: 720px;
		background-color: rgba( 255, 255, 255, .2);
		border-radius: .5rem;
	}

		.vote-now-footer-wrap{
			padding: 20px;
			font-style: italic;
		}

	/* FOOTER */

	.footer-container{
		width: 100%;
		min-width: 320px;
		margin: 0 auto;
		position: relative;
		z-index: 1;
		background: #000;
	}

		.footer{
			width: 80%;
			min-width: 280px;
			margin: 0 auto;
			padding: 250px 0;
			color: #999;
			text-align: center;
			position: relative;
			z-index: 9;
		}

			.footer a{
				text-decoration: none;
				color: #999;
			}

				.footer a:hover{
					text-decoration: underline;
					color: #fff;
				}

		.footer-video{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			z-index: 2;
			opacity: .5;
		}
		.footer-video-fade{
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			object-fit: cover;
			z-index: 3;
			background: linear-gradient(to top, rgba(0,0,0,1), rgba(0,0,0,0));
		}

		.statement{
			background: #000;
			color: #fff;
			padding: 50px 0;
			text-align: center;
			min-width: 280px;
			font-weight: 700;
			font-style: italic;
			font-size: 1.2rem;
			text-align: center;
		}

			.statement .line{
				display: inline-block;
			}

			.statement .icons{
				color: #111;
				font-size: .8rem;
			}
				.statement .icons a{
					color: #111;
				}

	@media only screen and (max-width: 1470px){
		.logo{
			width: 180px;
			height: 58px;
		}

		.menu .single{
			display: none;
		}

		.landing{
			background-image: url(media/portrait-tablet.jpg);
			background-position: center center;
			height:700px;
		}

		.slogan{
			font-size: 3.5rem;
			line-height: 3.2rem;
		}

		h1{
			font-size: 2.3rem;
		}

		p{
			font-size: 1rem;
			line-height: 1.5rem;
		}

		.meet-corrie-wrap{
			height: 500px;
		}

			.meet-corrie-window{
				width: 65%;
			}

		.update iframe{
			width: 100%;
			height: 500px;
		}


		.key-issues h1{
			font-size: 3.5rem;
			line-height: 3.2rem;
		}

		.key-issues .tile{
			width: 50%;
		}

		.key-issues .icon{
			width: 100px;
			height: 100px;
		}

		.vote-now .tile{
			padding: 5px 15px;
			width: 100%;
		}

		.footer{
			padding:180px 0;
		}

	}


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

		.top-social-container{
			display: block;
		}

		.menu, .social{
			display: none;
		}

		.burger{
			display: none;
		}

		.landing{
			background-image: url(media/portrait-mobile.jpg);
			background-position: center center;
			height: 600px;
		}

		.slogan-container{
			justify-content: flex-end;
			padding: 0 0 0 0;
			text-align: right;
			align-items: flex-end;
		}

		.slogan{
			float: right;
			text-shadow: 3px 3px 7px rgba(0, 0, 0, .5);
			font-size: 2.6rem;
			line-height: 2.5rem;
		}

		.landing-mobile-links{
			display: flex;
			align-self: flex-end;
		}

		.language{
			bottom: 55%;
		}

		.meet-corrie-mobile-background{
			display: none;
			position: static;
			top: 0;
			left: 0;
			width: 100%;
			height: 200px;
			background-image: url(media/meet-corrie-mobile.jpg);
			background-position: top right;
			background-size: cover;
			background-color: #f5f5f5;
		}

		.meet-corrie{
			background-image: url(media/meet-corrie-mobile.jpg);
			background-position: top center;
			background-size: 100%;
			background-color: #f5f5f5;
		}

			.meet-corrie h1{
				font-size: 1.6rem;
				width: 50%;
			}

		h1{
			font-size: 1.8rem;
		}

		p{
			font-size: .9rem;
			line-height: 1.2rem;
		}

		.meet-corrie-wrap{
			height: auto;
		}

			.meet-corrie-window{
				width:100%;
				height:100%;
				padding: 100px 0 0 0;
				min-height: 420px;
			}



		.key-issues h1{
			font-size: 2.8rem;
			line-height: 2.6rem;
		}

		.key-issues .tile{
			width: 100%;
			padding: 10px 0;
		}

		.key-issues .icon{
			width: 50px;
			height: 50px;
		}

		.vote-now-header, .key-issues-header{
			margin: 20px auto;
		}

		.vote-now h1{
			font-size: 2.8rem;
			line-height: 2.6rem;
		}

		.vote-now .tile, .key-issues .tile{
			padding: 5px 15px;
			margin:0 0 15px 0;
			width: 100%;
		}

		.footer{
			padding: 50px 0;
		}

	}