/* RESET */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
* {
  box-sizing:border-box;
  font-family: "Arial", sans-serif;
}
h1, h1 *, h2, h2 *, h3, h3 *{
	font-family: "knockout";
	font-weight:400;
	letter-spacing:3px;
}
body, html {
  margin:0;
  overflow-x:hidden;
}
body {
  background:#aaa;
}
@font-face {
    font-family: "knockout";
    src: url("/assets/fonts/knockout.woff") format('woff');
    font-weight: normal;
}
.mobile-only {
	display:none;
}


.red {
  color:#db4426;
}
.cf {
  clear:both;
}
.button {
  display: inline-block;
  border: 1px solid #fff;
  border-radius: 7px;
  color: #fff;
  font-weight: bold;
  padding: 10px 36px;
  text-decoration: none;
  text-transform:uppercase;
  font-size:14px;
	cursor:pointer;
}


.s1 {
  position:relative;
  height:200vw;
  background:#1c1b4c;
}
.s1 .decor {
  position: absolute;
  height: 100%;
  width: 100%;
}

.s1 .logo {
  position: absolute;
  z-index: 100;
  top: 4vw;
  left: 3vw;
  width: 14vw;
}
.s1 .logo img {

}
.s1 .vote {
  position: absolute;
  width: 19vw;
  z-index: 100;
  left: 40vw;
  top: 14vw;
}

.s1 .decor .d {
  position:absolute;
}
.s1 .decor .vid-grad {
  top: 12vw;
  height: 60vw;
  width: 100vw;
  background: linear-gradient(to bottom, #22264d00 0%,#22264d 70%, #22264d 100%);
  left: 0;
  z-index: 3;
}
.s1 .decor .d-1 {
  width: 87vw;
  height: 31vw;
  top: 16vw;
  left: -17vw;
  z-index: 10;
  background: linear-gradient(to right, #c441328f 0%,#22264d 100%);
  transform: rotate(45deg);
}
.s1 .decor .d-2 {
	height: 111vw;
  width: 38vw;
  background: #f00;
  background: linear-gradient(to bottom, #de3a26 0%,#264086 100%);
  z-index: 30;
  right: 6.75vw;
  top: 10.76vw;
  transform: rotate(45deg);
}
.s1 .decor .d-3 {
  left: -26vw;
  top: 50vw;
  width: 86vw;
  height: 31vw;
  background: #282e6c;
  z-index: 20;
  transform: rotate(45deg);
}
.s1 .decor .d-4 {
	right: -45vw;
  top: 70vw;
  width: 85vw;
  height: 85vw;
  z-index: 40;
  background: linear-gradient(to top left, #1c1b4c 0%,#3c2d64 100%);
  transform: rotate(45deg);
}
.s1 .decor .d-5 {
  top: 97.9vw;
  height: 50vw;
  width: 36vw;
  background: linear-gradient(to bottom left, #c44131 38%,#2f4184 100%);
  transform: skew(-45deg);
  z-index: 45;
  left: 32vw;
}
.s1 .decor .d-6 {
  background: #c44132;
  width: 32vw;
  height: 32vw;
  left: -16.4vw;
  top: 75.5vw;
  z-index: 15;
  transform: rotate(45deg);
}
.s1 .decor .d-7 {
  width: 35vw;
  height: 80vw;
  background: #add8e6;
  top: 90vw;
  left: -12vw;
  transform: rotate(45deg);
  background: linear-gradient(to bottom, #272a58 0%, #151533 70%);
}

.s1 video {
  width:100%;
}
.s1 .video {
  position:absolute;
}
.s1 .stats {
  position: absolute;
  z-index: 100;
  top: 63vw;
  width: 60vw;
  height: auto;
  left: 20vw;
  text-align: center;
  color: #fff;
}
.s1 .stats h3 {
	font-size: 4.7vw;
  text-transform: uppercase;
  line-height: 4.6vw;
}
.s1 .stats h3.small {
	font-size: 2.3vw;
	margin: 1.3vw 0 0;
}
.s1 .stats h3.red {
	margin-top:0;
	line-height:1vw;
}
.s1 .stats a {
  margin-top:3vw;
}

.s1 .pop-vid {
	z-index: 100;
	width: 64vw;
	top: 105vw;
	left: 17.5vw;
	height: 36vw;
	position: absolute;
}
.s1 .pop-vid iframe {
  width:100%;
  height:100%;
}

.s1 .join-convo {
  position: absolute;
  top: 161vw;
  z-index: 100;
  width: 80vw;
  left: 10vw;
  text-align: center;
}
.s1 .join-convo h2 {
  color: #fff;
	font-size: 4.7vw;
	text-transform: uppercase;
	line-height: 4.6vw;
}
.s1 .join-convo p {
	margin-top: 2vw;
	color: #fff;
	font-size: 1.7vw;
	line-height: 2.7vw;
}
.s1 .giffy-bottom {
	position: absolute;
	bottom: 1vw;
	z-index: 100;
	width: 16vw;
	text-align: center;
	left: 42vw;
}
.s1 .giffy-bottom h2 {
  color: #fff;
  text-transform: uppercase;
  font-size: 4vw;
  letter-spacing:-1px;
}






.s2 {
	overflow: hidden;
	position: relative;
	height: 140vw;
	background: #1c1d4f;
}

.s2 .decor .d {
  position:absolute;
}
.s2 .decor .d-1 {
	z-index: 10;
	width: 110vw;
  height: 110vw;
  left: 10vw;
  top: -43vw;
	background: linear-gradient(to top left, #1d1e51 0%, #282e6c 70%);
  transform: rotate(45deg);
}
.s2 .decor .d-2 {
	background-image: url(/assets/images/blue-poster.jpg);
	height: 85.2vw;
	width: 103.2vw;
	left: 0;
	bottom: 0vw;
	z-index: 5;
	background-size: cover;
	background-position: 120% 50%;
}
.s2 .decor .d-3 {
	width: 50vw;
  height: 50vw;
  right: -25.4vw;
  top: 64.8vw;
  z-index: 30;
  background: #282e6c;
  transform: rotate(45deg);
}
.s2 .decor .d-4 {
	bottom: -20vw;
	width: 37vw;
  height: 37vw;
  background: linear-gradient(to bottom right, #c44132 0%, #97434e 100%);
  left: -19.7vw;
  z-index: 10;
  transform: rotate(45deg);
}

.s2 .giffy {
  width: 36vw;
  position: absolute;
  left: 32vw;
  top: 1vw;
  z-index:100;
}
.s2 .giffy img {
  width:100%;
}


.s2 .tour-list {
  width: 66vw;
  position: absolute;
  top: 15vw;
  left: 17vw;
  z-index:100;
}
.s2 .tour-list .a-tour {
  width: 45%;
  height: 14vw;
  background-color: #333;
  float: left;
  margin: 1.5vw;
  margin-bottom: 6vw;
  position:relative;
	background-size:cover;
}
.a-tour.vegas {
	background-image:url('/assets/images/vegas.jpg')
}
.a-tour.minne {
	background-image:url('/assets/images/minne.jpg')
}
.a-tour.houston {
	background-image:url('/assets/images/houston.jpg')
}
.a-tour.irvine {
	background-image:url('/assets/images/crowd.jpg')
}
.a-tour.seattle {
	background-image:url('/assets/images/courage.jpg')
}
.a-tour.portland {
	background-image:url('/assets/images/no-nra.jpg')
}
.a-tour.tucson {
	background-image:url('/assets/images/emma.jpg')
}
.a-tour.fort {
	background-image:url('/assets/images/crowd-vsl.jpg')
}
.s2 .tour-list .a-tour .tour-box {
  position: absolute;
  bottom: -4vw;
  width: 94%;
  left: 3%;
  background: linear-gradient(to left, #161733 0%, #32294f 100%);
  text-align: center;
  color: #fff;
  padding: 2vw 2vw;
  height: 9vw;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.a-tour .tour-box .text {
  width:100%;
}
.a-tour .tour-box h3 {
  width: 100%;
  text-transform: uppercase;
  font-size: 1.5vw;
}
.a-tour .tour-box h4 {
  width: 100%;
  margin-top: 0.8vw;
  font-size: 1.4vw;
  font-weight: 100;
}
.s2 .rsvp {
	position: absolute;
	top: 109vw;
	left: 20vw;
	z-index: 100;
	font-size: 5vw;
	text-align: right;
	/*display:flex;*/
	width:60vw;
	/*justify-content:center;*/
	text-align:center;
}
.s2 .rsvp h2 {
	text-transform:uppercase;
	color:white;
	padding-right:1vw;
}
.s2 .rsvp .right {
	color:white;
	text-align: left;
	padding-left:2vw;
}
.s2 .rsvp .right p {
	font-size: 1.2vw;
	font-weight: 200;
	padding-top: 1vw;
	padding-bottom: 1vw;
}
.s2 .rsvp .right .select.inactive {
	height:2.3vw;
	position:relative;
}
.s2 .rsvp .right .select .chevron {
	display:none;
}
.s2 .rsvp .right .select.inactive .chevron {
	top: 0.7vw;
	display:block;
  right: 0.7vw;
  position: absolute;
  width: 6%;
}
.s2 .rsvp .right .select.inactive .a-city {
	opacity:0;
	pointer-events:none;
}
.s2 .rsvp .right .select {
	cursor:pointer;
	border: 1px solid white;
  border-radius: 4px;
  padding: 0.8vw 1.2vw;
	height:10.3vw;
	overflow:hidden;
	transition: height 0.2s ease-out;
}
.s2 .rsvp .select .a-city {
	font-size:1vw;
	font-weight:200;
	letter-spacing:1px;
	padding:8px 0;
	cursor:pointer;
	transition: opacity 0.2s ease-out;
	pointer-events:all;
	opacity:1;
}
.s2 .rsvp .join-us {
	display: none;
	position: absolute;
	top: 6.6vw;
}
.s2 .rsvp .join-us.active {
	display:inline-block;
}
.s2 .rsvp .select .a-city.selected {
	display:none;
}
.s2 .rsvp .select.inactive .a-city.selected {
	display:none;
}
.s2 .rsvp .select.inactive .a-city.selected.active {
	display: block;
	opacity: 1;
	margin-top: -0.8vw;
}
.s2 .cant-make-it {
	position:absolute;
	bottom:11vw;
	width:50vw;
	left:25vw;
	z-index:100;
	text-align:center;
	color:white;
	font-size:1.2vw;
}
.s2 .cant-make-it a {
	color: #fff;
	display: inline-block;
	padding-top: 1vw;
	text-decoration: none;
	font-size:1vw;
}
.s2 .cant-make-it a:after {
	content:' ';
	display:block;
	height:1px;
	width:100%;
	background:#d94426;
}



.news {
	padding:120px 0;
	background:#0d4684;
}
.news h2 {
  color: #fff;
  text-transform: uppercase;
  font-size: 4vw;
	text-align: center;
  letter-spacing:-1px;
	margin-bottom:40px;
}
.news .news-list {
	max-width:1300px;
	margin:0 auto;
	padding:0 30px;
	column-count:3;
	column-gap:3.6%;
}
.news .a-news {
	color: white;
  width: 100%;
  background: linear-gradient(to bottom right, #264187 0%, #c44132 100%);
	padding:10%;
  margin-bottom: 10%;
  break-inside: avoid;

}
.news .a-news h3 {
	text-transform: uppercase;
	font-size: 24px;
	line-height: 32px;
	margin-bottom:12px;
}
.news .a-news p {
	font-size:14px;
	line-height:24px;
}
.news .a-news a {
	color: white;
  text-decoration: none;
  border: 1px solid #fff;
  border-radius: 4px;
  text-transform: uppercase;
  padding: 8px 24px;
  display: inline-block;
  margin-top: 10%;
	font-size:14px;
	letter-spacing:1px;
}



.about {
	position:relative;
	height:50vw;
	background:#444;
	background-image:url('/assets/images/about-bg.jpg');
	background-size:cover;
	overflow:hidden;
}
.about .decor .d {
	position:absolute;
}
.about .d-1 {
	width: 116vw;
  height: 21vw;
	background: linear-gradient(to top right, #c14d4bf5 0%, #383d6f5e 100%);
  left: -32vw;
  top: 6.9vw;
  transform: rotate(45deg);
	z-index:30;
}
.about .d-2 {
	width: 22vw;
	height: 50vw;
	left: 0vw;
	top: 3.2vw;
	z-index: 20;
	background: #272b57;
	transform: skew(45deg);
}
.about .d-3 {
	width: 22vw;
  height: 30vw;
  left: -10vw;
  top: 25vw;
  z-index: 10;
  background: #274186;
  transform: skew(45deg);
}
.about .d-4 {
	width: 35vw;
	height: 51vw;
	right: -35vw;
	top: 0vw;
	z-index: 40;
	background: linear-gradient(to bottom left, #bc4138eb 66%, #272b57c4 100%);
	transform: skew(-45deg);
}
.about .about-words {
	position: absolute;
  z-index: 100;
  bottom: 14vw;
  left: 7vw;
}
.about h2 {
	font-size:5vw;
	color:white;
	text-transform:uppercase;
	margin-bottom:20px;
}
.about-credit {
	position:absolute;
	right:3vw;
	bottom:1.5vw;
	color:white;
	font-size:12px;
	z-index:100;
}
.about .overlay {
	display: none;
	height: 100vw;
	width: 100vw;
	background: #0000009c;
	z-index: 110;
	position: fixed;
	top: 0;
	left: 0;
}
.about .overlay.active {
	display:block;
}
.about .about-video {
	display:none;
	z-index: 200;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	align-items:center;
	justify-content: center;
}
.about .about-video.active {
	display:flex;
}
.about .about-video.active iframe {
	height: 34vw;
	width: 60vw;
}
.about .about-video img {
	position: absolute;
  width: 60px;
  height: 60px;
  left: 80vw;
  top: calc(50vh - 17vw - 20px);
  padding: 20px;
	cursor:pointer;
}


.contact {
	background:linear-gradient(to right, #fefcfc 0%, #dbdcda 100%);
	height:30vw;
	display:flex;
	align-items:center;
	justify-content: center;
}
.contact > div {

}
.contact .left {
	float:left;
}
.contact .right {
	float:right;
}
.contact .left h2 {
	text-transform: uppercase;
	color: #060726;
	margin-right:4vw;
	font-size: 5vw;
}
.contact .right label {
	display:block;
	color:#989997;
	padding-left:20px;
	font-style:italic;
	margin-bottom:4px;
}
.contact .right input {
	display: block;
	border: 1px solid #e0e0db;
	background: #fff;
	border-radius: 4px;
	-webkit-appearance: none;
	outline: none;
	width: 30vw;
	padding: 0.5vw;
	font-size: 16px;
}
.contact .right textarea {
	display: block;
  -webkit-appearance: none;
  border: 1px solid #e0e0db;
  background: #fff;
  border-radius: 4px;
  resize: vertical;
  outline: none;
  max-height: 18vw;
  min-height: 8vw;
  font-size: 16px;
  padding: 0.5vw;
  width: 30vw;
	margin-bottom:1vw;
}
.contact button {
	-webkit-appearance: none;
	background: #060726;
	outline:none;
}
.contact .button:disabled,
.contact button[disabled] {
	background:#aaa;
	cursor:default;
}
.contact .post {
	margin-left:20px;
}

.footer {
  background:#151632;
  text-align:center;
  color:white;
  padding:22px 0;
  font-size:12px;
  letter-spacing:1px;
}





@media screen and (max-width:768px) {
	.news h2 {
		font-size:7.2vw;
	}
	.news .news-list {
		column-count:1;
	}
	.news .a-news h3 {
		font-size:18px;
		line-height:22px;
	}
	.button {
		font-size:12px;
		padding:8px 16px;
	}
	.mobile-only {
		display:block;
	}
	.desktop-only {
		display:none;
	}

	.s1 {
		height:300vw;
	}
	.s1 .logo {
		top: 6vw;
		left: 31vw;
		width: 38vw;
	}
	.s1 .vote {
		top: 30vw;
    width: 33vw;
    left: 32vw;
	}
	.s1 .stats {
		top: 106vw;
    width: 80vw;
    left: 10vw;
	}
	.s1 .stats h3 {
		font-size: 6.7vw;
		line-height: 6.3vw;
	}
	.s1 .stats h3.small {
		font-size: 4vw;
		line-height: 5.6vw;
	}
	.s1 .decor .d-5 {
		display:none;
	}
	.s1 .pop-vid {
		top: 158vw;
    width: 90vw;
    left: 5vw;
    height: 50.6vw;
	}
	.s1 .stats a {
		margin-left:-2vw;
	}
	.s1 .join-convo {
		top:224vw;
	}
	.s1 .join-convo h2 {
		font-size: 7.2vw;
    line-height: 7.2vw;
	}
	.s1 .join-convo p {
		font-size: 4vw;
		line-height: 6vw;
	}
	.s1 .giffy-bottom {
		width:40vw;
		left:30vw;
	}


	.s2 {
		height:450vw;
	}
	.s2 .giffy {
		width: 80vw;
		left: 10vw;
	}
	.s2 .tour-list {

	}
	.s2 .tour-list .a-tour {
		width: 100%;
    height: 33vw;
    float: none;
		margin-bottom:14vw;
	}
	.a-tour .tour-box h3 {
		font-size: 4.5vw;
	}
	.a-tour .tour-box h4 {
		font-size:4vw;
	}
	.s2 .tour-list .a-tour .tour-box {
		height:21vw;
		bottom:-9vw;
	}
	.s2 .rsvp {
		top:402vw;
		width: 80vw;
		left: 10vw;
		display:block;
		text-align:center;
	}
	.s2 .rsvp h2 {
		text-align:center;
		font-size:7.2vw;
		margin-bottom:2vw;
	}
	.s2 .rsvp .right p {
		text-align:center;
		font-size:4vw;
		padding: 18px 0 13px;
	}
	.s2 .rsvp .right .select {
		width: 50vw;
    margin-left: 13vw;
		height:31vw;
	}
	.s2 .rsvp .right .select.inactive {
		height: 6vw;
	}
	.s2 .rsvp .select .a-city {
		font-size:3vw;
	}
	.s2 .cant-make-it {
		font-size:4vw;
	}
	.s2 .cant-make-it a {
		font-size:3vw;
	}
	.s2 .rsvp .join-us {
		top: 29.6vw;
		position: static;
		margin: 0 auto;
		display: none;
		width: 26vw;
		text-align: center;
		margin-top:5vw;
	}
	.s2 .rsvp .select.inactive .a-city.selected.active {
		margin-top:-1.3vw;
	}
	.s2 .rsvp .join-us.active {
		display:block;
	}
	.s2 .rsvp .right .select.inactive .chevron {
		top: 1.6vw;
		right: 1.8vw;
	}
	.s2 .decor .d-1 {
		width: 220vw;
		height: 230vw;
		left: -40vw;
		top: -63vw;
	}
	.s2 .decor .d-3 {
		top: 184.8vw;
	}
	.s1 .decor .d-4 {
		right: -47.5vw;
    top: 73vw;
	}
	.s2 .decor .d-2 {
		height: 145.2vw;
		width: 100vw;
		left: 0;
		top: 145vw;
		background-size: cover;
		background-position: 40% 50%;
	}




	.about .d-1 {
		display:none;
	}
	.about h2 {
		font-size:7.2vw;
		margin-bottom:2vw;
	}
	.about .about-words {
		bottom:3vw;
	}
	.about-credit {
		display:none;
	}


	.contact {
		height:94vw;
	}
	.contact .left, .contact .right {
		width:100%;
		float:none;
	}
	.contact > div {
		width:80vw;
		left:10vw;
		text-align: center;
	}
	.contact .left h2 {
		font-size:12.3vw;
	}
	.contact .right input {
		width:100%;
		font-size:4vw;
	}
	.contact .right textarea {
		width:100%;
		min-height:20vw;
		font-size:4vw;
	}
	.contact .right label {
		text-align: left;
	}
	.contact .pre {
		margin-top:3vw;
		text-align: left;
	}
}
