@charset "UTF-8";
/* CSS Document */

/* VOTE 18*/
.election-embed { height:600px; overflow:hidden }
#vote18 { padding: 0 0 40px 0; }
#vote18 h2 { padding: 0; }
.vote18-logo { width: auto; max-width: 350px; }
.backtotop { text-align: center; padding: 1em; color: rgba(204,0,0,1); }
.backtotop a { color: rgba(204,0,0,1); text-decoration: none; }
.backtotop a:hover { border-bottom: 2px solid; }
#content-vote18 { padding: 0; width: auto; margin: 0; }
#content-vote18-govote { padding: 3em 0 0 0; width: auto; margin: 0; background-color: #184376; text-align: center; }
#content-vote18-govote article { color: #fff; float: left; border-bottom:none; clear: none; width: 30%; margin: 0 1.5%; padding: 0 0 2em 0; }
#content-vote18-govote h2 { color: #8dd8f8; }
#content-vote18-govote article a { color: #eee; }
#content-vote18-govote article a.source-link { color: rgba(255,255,255,.25); text-decoration: none; }
#content article a.source-link { color: rgba(0,0,0,.5); text-decoration: none; }
#content-vote18-overview { padding: 2em 0 1em 0; width: auto; margin: 0; background: #fff url(../images/vote18/bg-stars.jpg) fixed; clear: both; }
#content-vote18-overview h2 { text-align: center; padding: 0 0 1em 0; }
#content-vote18-overview article { color: #333; float: none; border-bottom:none; clear: none; width: auto; margin: 0; padding: 0 0 1em 0; }

#content-vote18-overview article a { color: #184376; }
#content-vote18-overview article a.source-link { color: rgba(0,0,0,.25); text-decoration: none; }
#content article a.source-link { color: rgba(0,0,0,.5); text-decoration: none; }
#header-vote18 { background: #fff url(../images/vote18/bg-stars.jpg) fixed; background-size: 100%; text-align: center; padding: 2em 0 1em 0; }
#header-vote18 img { margin: 0 auto 30px auto; width: 500px; height: auto; }
#header-vote18 nav { background: none; height: auto; z-index: auto; position: relative; clear: none; font-weight: 400; float: none; margin: 0 auto;  }
#nav-vote18 ul { list-style: none; padding: 1em 0 0 0; }
#nav-vote18 ul li { display: inline-block; margin: 0 1em; font-size: 110%; padding: 0 0 1em 0; white-space: nowrap; }
#nav-vote18 ul li a { text-decoration: none; font-weight: 600; color: rgba(204,0,0,1); }
#nav-vote18 ul li a:hover { text-decoration: none; font-weight: 600; color: rgba(204,0,0,1); border-bottom: 4px solid #cc0000; }
#vote-teaser { float: none; color: rgba(0,0,0,.75); }
#content-vote18-govote article .img { float: none; width: 170px; height: 170px; background-color: transparent; margin: 10px auto;  }
#content-vote18-govote article img { width: 170px; height: 170px; margin: 0; }
#content-vote18-govote .article  { padding: 0; margin: 0; }
#overview { width: 48%; float: left; }
#classroom { width: 48%; float: right; }

#dates { background-color: #fff; padding: 2em 0 2em 0; text-align: center; }
#dates table { padding: 1em 0; margin: 0 auto; width: 100%; }
#dates table th { text-align: left; padding: 10px; background-color: #9cf; }
#dates table tr:nth-child(odd) { background-color: #e5f2ff; }
#dates table td { padding: 10px; text-align: left; }

#find { padding: 2em 1em; text-align: center; color: #fff; background: rgb(89,44,211);
background: linear-gradient(45deg, rgba(89,44,211,1) 0%, rgba(255,156,166,1) 100%);}
#find h2 { color: #fff; padding: 0 0 1em 0; }

#quiz { background-color: #92CFE0; padding: 2em 0 1em 0; }
.quiz-text { text-align: center; width: 70%; float: left; }
.quiz-text h2 { font-size: 250%; color: #fff; }
.quiz-text h3 { font-size: 350%; color: #096385; font-weight: bold; text-transform: uppercase; }
.quiz-icon { width: 30%; float: right; }
.quiz-icon img { width: 150px; height: auto; margin: 0 auto 1em auto; display: block; }
.get-started { background-color: #FF5527; border-radius: 5px; color: #fff !important; padding: 10px 20px; text-decoration: none; }
.get-started:after { content: ' ▶'; color: #D3E9ED; font-size: 70%; padding-left: 5px }
.get-started:hover { background-color: #ff3c08; cursor: pointer; }

#askquestion { background-color: #92CFE0; padding: 2em 0; font-size: 130%; text-align: center; }

.debate-content { width: 30%; float: right; padding-left: 2%; }
.debate-video { width: 68%; float: left; }

.d18map { width: 100%;; border: 1px solid gray; }

#new-districts { padding: 2em 0; background: #fff /*url(../images/vote18/bg-stars.jpg) fixed*/;  }
#new-districts h2 { text-align: center; padding: 0 0 1em 0; }
.district-map { width: 46%; text-align: center; vertical-align: top; padding: 0 0 .5em 0; float: left; margin: 0 2%; }
.district-map img { width: 500px; height: auto; }

.last-day-alert { padding: .5em 1em; text-align: center; background-color: rgba(255,214,0,1); color: #000; margin-top: 1em; display: inline-block; }
#special-election { background: #fff; padding: 1em 0; }
#special-election h2 { text-align: center; /*padding: .5em;  background-color: rgba(255,214,0,1); color: #000;*/ }
#special-election article h4 { color: rgba(255,255,255,1); font-size: 120%; padding: 0 0 .2em 0; margin: 0; }
#special-election article img { width: 95%; height: auto; display: block; margin: 0 auto .5em auto; }
#special-election article { text-align: center; color: rgba(255,255,255,.8); float: left; clear: none; width: 45%; margin: 1%; padding: 2.5% 1.5% 0 1.5%; border-bottom: none; }
#special-election article a { color: #fff; text-decoration: none; }
.Republican { background-color: #900; height: auto; float: left; }
/*.Republican:hover { background-color: #FF5555;}*/
.Democrat { background-color: #184376; height: auto; float: left; }
/*.Democrat:hover { background-color: #3B75CD; }*/
.Libertarian { background-color: #d0aa12; height: auto; float: left; }
.fade { opacity: 0.4; filter: alpha(opacity=40); /* msie */ background-color: #000; }
.meet-candidates { clear:both; border-top: 2px solid rgba(0,0,51,.1); padding-top: 1em; }
.meet-candidates ul { list-style: none; margin: 0; padding: 0 0 1em 0; }
#special-election article a:hover { text-decoration: underline; }
#special-election .group { float: left; width: 46%; margin: 2%; }
.map-d12 { width: 100%; }

.interview:hover { background-color: rgba(255,255,255,.3); }
.interview { dispay: block; padding: 5px; border-radius: 5px; background-color: rgba(255,255,255,.1); margin: 0 0 1em 0;  }
.interview a { text-decoration: none; display: block; width: auto; padding-left: 45px; background: url(../images/vote18/icon-interview.png) no-repeat; opacity: .9; min-height: 35px; line-height: 35px }
.interview a:hover { opacity: 1; }

.interviews article { border-bottom: 2px solid #eee !important; }

.candidates-group {float: left; width: 45%; margin: 1%; padding: 1.5%; }

#candidate-events { padding: 2em 0; background: #fff;  }
#candidate-events h2 { text-align: center; padding: 0 0 1em 0; }
.candidates-events { clear:both; padding-top: 1em; }


#threats, #vote-by-mail { background-color: #0a0a0a; color: #eee; padding: 2em 0; text-align: center; }
#threats h2, #vote-by-mail h2 { color: #8dd8f8; }
.threats-article { float: left; width: 30.33%; margin: 0 1.5%; text-align: left; }
.threats-article a { color: #fff; text-decoration: none; }
.threats-article a:hover { color: #8dd8f8; text-decoration: underline; }
.threats-article img { width: 100%; height: auto; border: 2px solid #eee; margin: 0 0 10px 0; }
.threats-article img:hover { width: 100%; height: auto; border: 2px solid #8dd8f8; margin: 0 0 10px 0; }
.threat-tag { font-size: 120%; padding: 0 0 2em 0; }

.vote-by-mail-video { width:48%; margin: 0 1%; float: left; }
.vote-by-mail-video2 { width:58%; margin: 0 auto; }


/*
#republicans { width: 290px; float: left; }
#democrats { width: 870px; float: right; }
*/

#inline-wufoo { background-color: #fff; padding: 2em; }
#inline0, #inline2 { background-color: #900; padding: 2em; color: rgba(255,255,255,.8); }
#inline1, #inline3 { background-color: #184376; padding: 2em; color: rgba(255,255,255,.8); }
#inline0 h4, #inline1 h4, #inline2 h4, #inline3 h4 { color: #fff; }
#inline0 a, #inline1 a, #inline2 a, #inline3 a { color: #fff; }

#countdown { background-color: #8dd8f8; padding: 2em 0 1em 0; }
#countdown h2 { text-align: center; color: #184376; }

.animated-videos { clear: both; /*border-bottom: 2px solid rgba(0,0,51,.1);*/ padding: 0; margin: .5em 0 2em 0; }
.vote-video { float: left; width: 30.33%; margin: 1.5%; padding: 0; text-align: center; font-size: 90%; }
.vote-video a { text-decoration: none; }
.vote-video a:hover { text-decoration: underline; color: #8dd8f8; }
.vote-video img { width: 98%; border: 4px solid #184376; margin: 0 0 5px 0; }
.vote-video img:hover { border: 4px solid #8dd8f8; margin: 0 0 5px 0; }

#instagram  { background-color: #fff; padding: 2em 0; }
#instagram h2 { text-align: center; padding: 0 0 1em 0; }
#instagram em { font-size: 80%; }
.instagram { width: 35%; margin-right: 5%; float: left; }
.lightwidget { width: 60%; float: right; }


.timer { color: #555; }

.timer-session {
  width: auto;
  margin: 0;
}
.timer-session:after {
  content: "";
  display: table;
  clear: both;
}

.timer-session-action {
  float: none;
  width: auto;
  text-align: center;
  margin: 0 0 1em 0; 
  padding: .5em 0;
}

.timer-session-link {
  display: inline;
  cursor: pointer;
  margin: 0 1em; 
}

.timer-session-link a { font-weight: 400; font-size: 120%; color: #fff; }

.vote-t-link { /*color: #cc0000; border-bottom: 2px solid #fff; font-weight: 600;*/ }

.timer-session-link .vote-t-link:hover {
  color: #c00;
}

.timer-session-stop {
  width: 15px;
  height: 15px;
  border-radius: 1px;
  float: left;
  background: rgba(255, 255, 255, 0.2);
}

.timer-session-ellipse {
  display: none;
}

.timer-session-log {
  float: none;
  text-align: center;
}

#day:before {
  content: 'until ';
}

.timer-digits {
  text-align: center;
}

.timer-digit-group {
  display: inline-block;
  position: relative;
  background-color: #fff;
  margin: 1em;
  padding: 1em;
  border-radius: 50%;
  width: 100px;
  height: 100px; 
}

.timer-digit {
  position: relative;
  font-size: 50px;
  text-align: center;
  font-weight: bold;
  letter-spacing: .1em;
  color: #333;
}

.timer-colon {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  left: 99%;
  content: ":";
  font-size: 20px;
  font-weight: 200;
  display: block;
  opacity: 0;
}

#day { font-size: 110%; }



@media (max-width: 1200px) {
#special-election article h4 { color: rgba(255,255,255,1); font-size: 130%; padding: 0; margin: 0; }
#special-election article img { width: 140px; height: 140px; display: block; margin: 0 auto .5em auto; }
#special-election { font-size: 90%; }
#content-vote18-govote article p { font-size: 80%; }
#content-vote18-govote article h3 { font-size: 140%; }
#content-vote18-govote article .img { float: none; width: 140px; height: 140px; background-color: transparent; margin: 10px auto; }
#content-vote18-govote article img { width: 140px; height: 140px; margin: 0; }
#nav-vote18 ul li { display: inline; margin: 0 0 0 2em; font-size: 100%; }
#header-vote18 img { margin: 30px auto; width: 500px; }
#new-districts table td { display: block; float: left; clear: left; }
.district-map img { width: 420px; }
}


@media only screen and ( min-width: 768px) and ( max-width: 960px ) {
#special-election article h4 { color: rgba(255,255,255,1); font-size: 120%; padding: 0; margin: 0; }
#special-election article img { width: 120px; height: 120px; display: block; margin: 0 auto .5em auto; }
#special-election { font-size: 90%; }
.debate-content { width: auto; float: none; }
.debate-video { width: auto; float: none; }
.meet-candidates { clear:both; border-top: none; padding-top: 1em; }
.meet-candidates h3 { text-align: left; }
.vote-video { width: 46%; float: left; margin: 1%; padding: 0; text-align: center; font-size: 90%; }
.vote-video img { width: 98%; border: 2px solid #184376; margin: 0 0 5px 0; }
.vote-video img:hover { border: 2px solid #8dd8f8; margin: 0 0 5px 0; }
#nav-vote18 ul li { display: inline; margin: 0 0 0 2em; font-size: 100%; }
#header-vote18 img { margin: 30px auto; width: 400px; }
.instagram { width: auto; margin-right: 0; float: none; }
.lightwidget { width: auto; float: none; }
.district-map { float: none; width: 100%; margin: 0; }
.district-map img { width: 600px; }

.quiz-text { width: 80%; }
.quiz-text h2 { font-size: 220%; color: #fff; }
.quiz-text h3 { font-size: 280%; color: #096385; font-weight: bold; text-transform: uppercase; }
.quiz-icon { width: 20%; }
.quiz-icon img { width: 130px; height: auto; margin: 0 auto; display: block; }
}

@media only screen and ( max-width: 767px) { 
.vote18-logo { width: auto; max-width: 250px; }
#header-vote18 { padding: 0; margin: 0; font-size: 90%; background: #fff url(../images/vote18/bg-stars.jpg) fixed; background-size: cover; text-align: center;  }
#nav-vote18 { display: block !important; margin: 0 !important; font-size: 100%; }
#nav-vote18 ul li { display: block; margin: 0; width: 100%; font-size: 100%; }
#content-vote18-govote { padding: 2em 0 0 0; }
#content-vote18-govote article { color: #fff; float: none; border-bottom:none; clear: none; width: auto; margin: 0 10px; padding: 1em; }
#content-vote18-govote article .img { float: none; width: 100px; height: 100px; background-color: transparent; margin: 10px auto; display: block }
#content-vote18-govote article img { width: 100px; height: 100px; margin: 0; display: block; }
#content-vote18-overview { font-size: 90%; padding: 5%; }
#overview { width: auto; float: none; }
#classroom { width: auto; float: none; }
#special-election { background: #fff; padding: 5%; }
#special-election article h4 { color: rgba(255,255,255,1); font-size: 120%; padding: 0; margin: 0; }
#special-election article img { width: 100px; height: 100px; display: block; margin: 0 auto .5em auto; }
.debate-content { width: auto; float: none; }
.debate-video { width: auto; float: none; }
.vote-video { width: 100%; float: none; margin: 0 1% 1em 1%; padding: 0; text-align: center; font-size: 90%; }
.vote-video img { width: 98%; border: 2px solid #184376; margin: 0 0 5px 0; }
.vote-video img:hover { border: 2px solid #8dd8f8; margin: 0 0 5px 0; }
.meet-candidates { clear:both; border-top: none; padding-top: 0; }
.Republican { background-color: #900; width: 45%; height: auto; float: none; }
.Democrat { background-color: #184376; width: 45%; height: auto; float: none; }
.interview a { line-height: 150%; }
#instagram { padding: 1em; }
.instagram { width: auto; margin-right: 0; float: none; }
.lightwidget { width: auto; float: none; }
.candidates-group { width: auto; float: none; padding: 2em 0 0 0; clear: left; }

#countdown { font-size: 80%; }
.timer-session-link { display: block; cursor: pointer; margin: 0 1em; }
.timer-digit-group {
  display: inline-block;
  position: relative;
  margin: 0 .1em;
  background-color: transparent;
  padding: 1;
  border-radius: none;
  width: auto;
  height: auto; 
}
.timer-digit {
  position: relative;
  font-size: 35px;
  text-align: center;
  font-weight: bold;
  letter-spacing: .1em;
  color: #333;
  padding: 0 0 .2em 0;
}

.threats-article { float: none; width: 90%; margin: 0 5% 2em 5%; text-align: center; }
.threats-article img { max-width: 480px; }

#new-districts { padding: 1em; }
#candidate-events { padding: 1em; }
.district-map { float: none; width: 100%; margin: 0; }
.district-map img { width: 100%; }

.quiz-text { width: auto; float: none; padding: 0 1em 2em 1em; }
.quiz-text h2 { font-size: 220%; color: #fff; line-height: 100%; margin: 0 0 .3em 0;}
.quiz-text h3 { font-size: 280%; color: #096385; font-weight: bold; text-transform: uppercase; line-height: 100%; margin: 0 0 .3em 0;}
.quiz-icon { width: auto; float: none; }
.quiz-icon img { width: 130px; height: auto; margin: 0 auto; display: block; }
.election-embed { height:1200px; overflow:hidden }
	
.vote-by-mail-video { width: 90%; margin: 0 5%; float: none; }
.vote-by-mail-video2 { width: 90%; margin: 0 5%; }
}