@import url("https://fonts.googleapis.com/css?family=Merriweather");
body {
  margin: 0;
  width: 100%;
  overflow-x: hidden; }

.commarea {
  min-width: 300px;
  max-width: 400px;
  padding: 2px;
  z-index: 9999;
  background: #F0F0F0;
  border: 1px solid #a9a9a9;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  font-family: "Merriweather";
  text-align: left;
  opacity: 0.8;
  font-size: 10px;
  position: fixed; }

h1, h2, h3, h4, h5, h6, body {
  font-family: "Helvetica Neue", Helvetica, Roboto, Arial, sans-serif; }

h4, h3 {
  margin: 0; }

h3 {
  text-align: center; }

p {
  font-family: 'Merriweather',Georgia, Times New Roman, serif; }

img {
  vertical-align: middle; }

.social {
  width: 80px;
  float: right;
  margin-top: 10px; }

.social img {
  margin: 0 5px;
  width: 30px; }

.twitter, .fb {
  float: left;
  opacity: 0.8; }

.twitter {
  margin-left: 10px; }

.twitter:hover, .fb:hover {
  opacity: 1;
  cursor: pointer; }

#embed .container, #embed .statewide {
  margin: 0 auto; }

/* Style the navbar */
#navbar {
  background-color: #201D1D;
  height: 50px; }

/* The dropdown container */
.dropdown {
  float: left;
  overflow: hidden; }

/* Dropdown button */
.linkout .dropbtn {
  border: none;
  outline: none;
  color: white;
  font-size: 20px;
  line-height: 28px;
  padding: 10px;
  font-weight: bold;
  width: 150px;
  height: 50px;
  background-color: inherit;
  font-family: inherit;
  /* Important for vertical align on mobile phones */
  margin: 0;
  /* Important for vertical align on mobile phones */
  margin-right: 20px; }

/* Add a red background color to navbar links on hover */
.navbar a:hover, .dropdown:hover .dropbtn {
  background-color: #FFD106;
  color: #201D1D; }

/* Dropdown content (hidden by default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #201D1D;
  color: #f9f9f9;
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  z-index: 1; }

/* Links inside the dropdown */
.dropdown-content a {
  float: none;
  width: 130px;
  color: #f9f9f9;
  padding: 3px 10px;
  text-decoration: none;
  display: block;
  font-size: 13px;
  font-weight: normal;
  border-bottom: #f9f9f9 1px solid;
  text-align: left; }

.dropdown-content a:first {
  padding-top: 50px; }

/* Add a grey background color to dropdown links on hover */
.dropdown-content a:hover {
  background-color: #2e2925; }

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {
  display: block; }

/* Page content */
.content {
  padding: 16px; }

/* The sticky class is added to the navbar with JS when it reaches its scroll position */
.sticky {
  position: fixed;
  top: 0;
  width: 100%;
  z-index: 99999999;
  animation: smoothScroll 0.4s forwards; }

#st {
  float: left;
  width: 100px;
  margin: 0 10px;
  margin-top: 10px; }

.choose {
  width: 90%;
  margin: 0 auto;
  max-width: 1024px;
  font-weight: bold;
  color: #fff; }

.ad {
  height: 90px;
  width: 728px;
  margin: 40px auto;
  clear: both; }

.ad div {
  display: block !important;
  margin: 0 auto; }

#bottom a {
  display: block;
  font-weight: bold; }

#bottom {
  margin-bottom: 100px;
  clear: both; }

#footer {
  background: #201D1D;
  color: #fff;
  padding: 2% 5%;
  font-size: .7rem; }

/* Add some top padding to the page content to prevent sudden quick movement (as the navigation bar gets a new position at the top of the page (position:fixed and top:0) */
.sticky + .content {
  padding-top: 60px; }

@keyframes smoothScroll {
  0% {
    transform: translateY(-40px); }
  100% {
    transform: translateY(0px); } }

.svgs {
  width: 97%;
  float: right;
  margin-bottom: 10px; }

svg {
  cursor: pointer; }

path {
  z-index: 99; }

.grouprace {
  width: 100%;
  clear: both;
  margin-top: 30px; }

.grouprace:first {
  margin: 0; }

.geo {
  clear: both; }

.geo .square {
  display: none; }

.statewide {
  clear: both;
  margin-top: 40px; }

#logo {
  display: block;
  max-width: 500px; }

.statewide .races {
  width: 97%;
  float: left; }

.statewide .race {
  width: 100%; }

#embed h3 {
  font-size: 14px; }

#embed .candidate, #embed .votes, #embed .race p {
  font-size: 10px; }

#embed {
  max-width: 330px;
  background-color: #fff;
  margin: 0 auto; }

#embed .container {
  background-color: #f2f2f2;
  padding: 10px 10px;
  margin: 0 auto; }

#embed .race, #embed .statewide .races {
  float: none;
  margin: 0; }

#embed .statewide .races {
  width: 97%;
  margin: 0 auto; }

.race {
  width: 97%;
  margin: 2px 1%;
  float: left; }

#state-IL-1 .race {
  float: left;
  width: 100%; }

#statewide, #chicagoarea, #allcounties {
  clear: both; }

.race p {
  margin: 1px 0 4px;
  font-size: 11px;
  min-height: 14px; }

.race h3 {
  text-align: left; }

.race.dem h3 {
  border-bottom: 3px solid #2b2be2; }

.race.gop h3 {
  border-bottom: 3px solid #f90b0b; }

.race.grn h3 {
  border-bottom: 3px solid #1A391A; }

.race.ref {
  width: 97%; }

.race.ref h4 {
  border-bottom: 3px solid #2e2925;
  font-style: italic;
  font-weight: normal;
  font-size: 13px;
  font-family: "Merriweather"; }

.candidate, #bottom a {
  padding: 2px 2%;
  min-height: 16px;
  background-color: #fff;
  border-bottom: 0;
  width: 96%;
  font-size: 13px; }

.candidate img {
  vertical-align: middle;
  height: 20px; }

.candname {
  float: left;
  width: 48%;
  padding: 0 1%; }

.votes {
  float: left;
  width: 31%;
  padding: 0 1%; }

.candidate span {
  font-size: 10px;
  float: right;
  line-height: 15px; }

.square {
  float: left; }

.statehouserace {
  padding-top: 40px; }

.tooltip h3 {
  font-size: 14px; }

.tooltip .square, .square {
  width: 12px;
  height: 12px;
  margin-right: 5px; }

.tooltip .race p {
  font-size: 8px; }

.tooltip .race {
  margin: 0; }

.tooltip span {
  font-size: 8px; }

.tooltip .candidate {
  padding: 4px 2%;
  min-height: 13px;
  background-color: #fff;
  border-bottom: 2px solid #f2f2f2;
  width: 97%;
  font-size: 11px; }

.percent {
  float: left;
  width: 14%;
  margin: 0 1%;
  background-color: #d2d2d2;
  height: 16px; }

.dem .candidate .percentrect {
  background-color: #2b2be2;
  height: 16px;
  width: 100%; }

.gop .candidate .percentrect {
  background-color: #f90b0b;
  height: 16px;
  width: 100%; }

.grn .candidate .percentrect {
  background-color: #1A391A;
  height: 16px;
  width: 100%; }

.ref .candidate .percentrect {
  background-color: #2e2925;
  height: 16px;
  width: 100%; }

.demwinner {
  background-color: #DEDDFD; }

.gopwinner {
  background-color: #FBDADB; }

.grnwinner {
  background-color: #CBE7CB; }

.refwinner {
  background-color: #a1a1a1; }

#toggle, #AGtoggle {
  width: 240px;
  margin: 0 auto; }

.button {
  background-color: #aeaeae;
  width: 90px;
  font-family: Helvetica Neue;
  text-align: center;
  font-weight: bold;
  padding: 10px;
  font-size: 15px;
  float: left;
  margin: 0 4px;
  margin-bottom: 20px;
  -webkit-border-radius: 10px;
  -moz-border-radius: 10px;
  -ms-border-radius: 10px;
  border-radius: 10px;
  border: 1px solid #ededed;
  cursor: pointer; }

#demorace.active, #demoracegov.active, #AGdemorace.active {
  background-color: #2b2be2;
  color: #fff; }

#demoracegov:hover, #AGdemorace:hover {
  background-color: #3D38A3;
  color: #fff; }

#goprace.active, #gopracegov.active, #AGgoprace.active, #AGgop.active {
  background-color: #f90b0b;
  color: #fff; }

#gopracegov:hover, #AGgoprace:hover, #AGgop:hover {
  background-color: #C44545;
  color: #fff; }

.groupgeo {
  text-align: center; }

#govmap, #agmap {
  max-height: 600px; }

@media only screen and (min-width: 100px) and (max-width: 728px) {
  .ad {
    width: 320px;
    height: 50px; } }

@media only screen and (min-width: 100px) and (max-width: 580px) {
  .race {
    width: 97%;
    margin: 0 1%;
    float: left;
    margin-bottom: 30px;
    font-size: 10px; }
  .candidate {
    padding: 2px 2%;
    font-size: 16px; }
  .candidate img {
    vertical-align: middle;
    height: 15px; }
  .statewide {
    float: none;
    width: 100%; }
  #statehouseresults {
    width: 100%; }
  .svgs, #statewide, .statewide .races {
    width: 100%;
    float: right;
    margin: 20px 0; }
  #toggle {
    margin: 20px auto;
    height: 60px; }
  .maphover {
    display: none; }
  #embed .container, #embed .statewide {
    margin: 0 auto; } }

.tooltip {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  background-color: #f2f2f2;
  border: 1px solid #f2f2f2;
  width: 250px; }

/* SELECT2 */
select, input {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  height: 30px;
  margin: 10px auto;
  font-family: "Helvetica Neue";
  font-size: 13px;
  font-weight: normal;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.07;
  color: #1a1a1a;
  width: 250px;
  font-size: 15px; }

.selection, .select2-results__option, .select2-results__option--highlighted {
  width: 400px;
  min-height: 15px;
  font-family: "Helvetica Neue";
  font-size: 12px;
  font-weight: bold;
  font-style: normal;
  font-stretch: normal;
  line-height: 1.07;
  color: #2e2925; }

.select2-results__option, .select2-results__option--highlighted {
  font-size: 12px; }

.select2-container {
  margin-right: 20px;
  margin-top: 10px;
  height: 30px; }

.select2-container--default .select2-selection--single .select2-selection__rendered {
  color: #827f7c;
  line-height: 27px;
  width: 97%;
  height: 30px; }

.select2-container {
  margin-top: 10px; }

.select2-container--open .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px; }

.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true], .select2-results__option {
  width: 245px;
  padding-right: 0; }

.select2-container--open .select2-dropdown--below {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px; }

.select2-container--default .select2-results__option--highlighted[aria-selected] {
  color: #827f7c;
  background: #f5f5f5;
  border-bottom: solid 1px #e2e2e2;
  border-top: solid 1px #e2e2e2;
  border-right: solid 1px #e2e2e2; }

.select2-search__field, input, input:matches([type="password"], [type="search"]) {
  font-family: "Helvetica Neue";
  border: 1px solid #e2e2e2;
  background: #e2e2e2;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  padding-top: 10px;
  padding-bottom: 10px; }

.select2-container--default .select2-search--dropdown .select2-search__field {
  font-family: "Helvetica Neue";
  border: 1px solid #e2e2e2;
  background: #e2e2e2 url("../img/search.svg") no-repeat 10px 7px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 30px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px; }

input[type="search"] {
  -webkit-appearance: textfield;
  font-family: "Helvetica Neue";
  border: 1px solid #e2e2e2;
  background: #e2e2e2 url("../img/search.svg") no-repeat 10px 10px;
  padding-top: 10px;
  padding-bottom: 10px;
  padding-left: 30px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px; }

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
  border: none;
  background: url("../img/arrow.svg");
  background-size: 62%; }

.select2-container--default .select2-selection--single .select2-selection__arrow b {
  border: none; }

.select2-selection__arrow, .select2-container--default .select2-selection--single .select2-selection__arrow {
  width: 35px;
  height: 30px;
  background: url("../img/arrow.svg") #FFD106 no-repeat center;
  background-size: 62% !important;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px; }

.select2-selection__arrow:hover, .select2-container--default .select2-selection--single .select2-selection__arrow:hover {
  background-color: #FDD43F; }

.select2-selection__arrow, .select2-container--open .select2-selection--single .select2-selection__arrow {
  background: url("../img/arrowopen.svg") #FFD106 no-repeat center;
  background-size: 62%; }

.select2-container--open .select2-selection--single .select2-selection__rendered {
  color: #201D1D; }

.select2-container--default .select2-selection--single .select2-selection__arrow {
  top: 0;
  right: 0; }

@media only screen and (min-width: 650px) and (max-width: 700px) {
  .social {
    display: none; } }

@media only screen and (min-width: 100px) and (max-width: 480px) {
  .votes {
    font-size: 11px; }
  .candname {
    line-height: 13px;
    font-size: 11px; } }

.select2 .select2-container .select2-container--default, .select2-container--default .select2-selection--single, .select2-container .select2-selection--single {
  height: 30px; }

.select2-container--open .select2-dropdown--below, select2-search select2-search--dropdown, span.select2-dropdown.select2-dropdown--below {
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  width: 228px; }

.select2-search--dropdown {
  background: #ffffff;
  font-size: 14px;
  padding: 10px;
  border-top: 1px solid #e2e2e2;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  width: 228px; }

.select2-container--open .select2-dropdown, .select2-dropdown .select2-dropdown--below {
  top: 0;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  width: 400px; }

.select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple {
  height: 30px; }

.select2-container--open .select2-selection--single .select2-selection__placeholder {
  color: #201D1D; }

.select2-container--default .select2-selection--single, .select2-dropdown, .select2-dropdown {
  border: 1px sold #e2e2e2; }

.select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true], .select2-results__option {
  padding-top: 10px;
  padding-bottom: 10px; }

.select2-container {
  margin-right: 0; }

.select2-dropdown, select2-dropdown--below {
  width: 250px !important; }

/* IPAD PORTRAIT */
@media only screen and (min-width: 768px) and (max-width: 1024px) {
  /* STYLES GO HERE */ }

/* ON THE PHONE */
@media only screen and (min-width: 100px) and (max-width: 770px) {
  .linkout {
    font-size: 16px;
    line-height: 20px;
    padding: 0 2px; }
  select, .selection {
    margin: 0 auto;
    height: 20px;
    width: 150px;
    font-size: 13px; }
  .select2-container {
    height: 20px; }
  .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true], .select2-results__option {
    overflow-x: hidden; }
  .select2-container {
    margin: 0 auto; }
  .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true], .select2-results__option {
    padding-right: 20px; }
  span.select2.select2-container.select2-container--default {
    margin-top: 10px;
    width: 250px !important; }
  .select2-container--default .select2-results > .select2-results__options {
    overflow-x: hidden; }
  .select2-search--dropdown {
    background: #ffffff;
    font-size: 14px;
    padding: 10px;
    border-top: 1px solid #e2e2e2; }
  .select2-container--default .select2-search--dropdown .select2-search__field {
    font-family: "Helvetica Neue";
    border: 1px solid #e2e2e2;
    background: #e2e2e2 url("../img/search.svg") no-repeat 10px 7px;
    padding-left: 30px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    padding-top: 10px;
    padding-bottom: 10px; }
  .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true], .select2-results__option {
    padding-top: 10px;
    padding-bottom: 10px; } }

@media only screen and (min-width: 100px) and (max-width: 850px) {
  select, .selection, .select2-results__option, .select2-results__option--highlighted {
    width: 100%;
    font-size: 13px; }
  .linkout {
    font-size: 16px;
    padding: 0 2px; } }

@media only screen and (min-width: 100px) and (max-width: 701px) {
  #statewide .statewide, #statewide .svgs {
    width: 100%; } }

/* ON THE PHONE */
@media only screen and (min-width: 100px) and (max-width: 760px) {
  .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true], .select2-results__option {
    overflow-x: hidden; }
  select, .selection, .select2-results__option, .select2-results__option--highlighted {
    font-size: 12px;
    width: 100%; }
  .select2-container {
    margin: 0 auto; }
  button {
    width: 49%;
    font-size: 0.9em;
    margin-bottom: 5px;
    line-height: 9px; }
  .select2-container--default .select2-results > .select2-results__options {
    overflow-x: hidden; }
  .select2-search--dropdown {
    background: #ffffff;
    font-size: 14px;
    padding: 10px;
    border-top: 1px solid #e2e2e2; }
  .select2-container--default .select2-search--dropdown .select2-search__field {
    font-family: "Helvetica Neue";
    border: 1px solid #e2e2e2;
    background: #e2e2e2 url("../img/search.svg") no-repeat 10px 10px;
    padding-left: 30px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    border-radius: 2px;
    padding-top: 10px;
    padding-bottom: 10px; }
  .select2-container--default .select2-results__option--highlighted[aria-selected], .select2-container--default .select2-results__option[aria-selected=true], .select2-results__option {
    padding-top: 10px;
    padding-bottom: 10px; }
  #alert {
    font-size: 15px; }
  #container {
    width: 86%;
    margin: 0 7%; } }

@media only screen and (min-width: 100px) and (max-width: 645px) {
  .linkout {
    width: 0;
    height: 0;
    visibility: hidden;
    display: none; } }

@media only screen and (min-width: 100px) and (max-width: 475px) {
  span.select2.select2-container.select2-container--default {
    margin-top: 10px;
    width: 140px !important; }
  .select2-container--open .select2-dropdown, .select2-dropdown .select2-dropdown--below {
    top: 10px; } }

.maphover {
  font-size: 12px;
  text-transform: capitalize;
  cursor: pointer; }

.maphover:hover {
  font-size: #fc5158; }

#statedistrictsvg {
  position: fixed;
  right: 10px;
  bottom: 10px;
  -webkit-border-radius: 2px;
  -moz-border-radius: 2px;
  -ms-border-radius: 2px;
  border-radius: 2px;
  width: 200px;
  background-color: #ffffff;
  border: #2e2925 1px solid;
  opacity: 0;
  z-index: -9; }