#xoutpopup{
  position:absolute !important;
  top:10px !important;
  right:20px !important;
}

.vote{
  height:15px;
  width:15px;
  border:2px solid black;
  background:black;
  color:white;
  padding: 2px 8px 2px 8px;
}

hr{
	height: 5px;
	width: 90%;
	background: linear-gradient(to right, #F04E3B 25%, #08BCD8 25% 50%, #019AD9 50% 75%, #FFCB08 75%);
		}

.hide{
  display:none;
}

#choose-lawmaker{
  font-size:20px;
  font-weight:800;
  text-align:center;
  max-width: 90%;
}

body{
	text-align: center;
  font-family: Roboto, Arial, Helvetica, sans-serif;

}

#headshot img {
  margin:10px 0px 15px 0px;
	width: 30%;
  max-width:500px;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}

table{
  margin-left:2%;
  margin-right:2%;
}

td{
  text-align:center;
  padding-bottom:8px;
}

.billsection h4{
  font-size:20px;
  background-color:#183149;
  color:white;
  padding:5px;
}

.description{
  border-bottom:1px solid black;
}

#findmylawmaker{
  color:white;
  border:2px solid white;
  border-radius:50px;
  padding:10% 3% 10% 3%;
  width:80vw;
  background-color:#183149;
  z-index:10;
  position: fixed !important;
  top: 5% !important;
  right:10vw !important;
}

.fadein{ -webkit-animation: fadeIn 1s;
  animation: fadeIn 1s
}

/* Add animation (fade in the popup) */
@-webkit-keyframes fadeIn {
  from {opacity: 0;}
  to {opacity: 1;}
}

@keyframes fadeIn {
  from {opacity: 0;}
  to {opacity:1 ;}
}

#my-svg {
  filter: drop-shadow(3px 5px 2px rgb(0 0 0 / 0.4));
}

@media screen and (max-width: 768px) {
  /* Force table elements to behave like blocks */
  table, thead, tbody, th, td, tr {
    display: block;
    width: 100%;
  }

  table{
    margin:0px 0px 0px 0px;
  }

  /* Hide the heading rows for better card-like layout */
  .heading {
    display:none;
  }

  tr {
    margin-bottom: 1rem;
  }

  .description{
    border-bottom:none;
  }

  .vote-result{
    background-color:lightgrey;
  }
}