@font-face {
  font-family: "ralewayblack";
  src: url("./fonts/webfontkit-raleway/raleway-black-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-black-webfont.woff") format("woff"),
    url("./fonts/raleway/Raleway-Black.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewayblack_italic";
  src: url("./fonts/webfontkit-raleway/raleway-blackitalic-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-blackitalic-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewaybold";
  src: url("./fonts/webfontkit-raleway/raleway-bold-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-bold-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewaybold_italic";
  src: url("./fonts/webfontkit-raleway/raleway-bolditalic-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-bolditalic-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewayextrabold";
  src: url("./fonts/webfontkit-raleway/raleway-extrabold-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-extrabold-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewayextrabold_italic";
  src: url("./fonts/webfontkit-raleway/raleway-extrabolditalic-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-extrabolditalic-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewayextralight";
  src: url("./fonts/webfontkit-raleway/raleway-extralight-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-extralight-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewayextralight_italic";
  src: url("./fonts/webfontkit-raleway/raleway-extralightitalic-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-extralightitalic-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewayitalic";
  src: url("./fonts/webfontkit-raleway/raleway-italic-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-italic-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewaylight";
  src: url("./fonts/webfontkit-raleway/raleway-light-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-light-webfont.woff") format("woff"),
    url("./fonts/raleway/Raleway-Light.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewaylight_italic";
  src: url("./fonts/webfontkit-raleway/raleway-lightitalic-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-lightitalic-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewaysemi_bold";
  src: url("./fonts/webfontkit-raleway/raleway-semibold-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-semibold-webfont.woff")
      format("woff");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "ralewaymedium";
  src: url("./fonts/webfontkit-raleway/raleway-medium-webfont.woff2")
      format("woff2"),
    url("./fonts/webfontkit-raleway/raleway-medium-webfont.woff") format("woff"),
    url("./fonts/raleway/Raleway-Medium.ttf") format("truetype");
  font-weight: normal;
  font-style: normal;
}

.teachers-icon {
  background-image: url("../wp-content/uploads/2018/01/teachers.png");
}
.food-icon {
  background-image: url("../wp-content/uploads/2018/01/food.png");
}
.health-icon {
  background-image: url("../wp-content/uploads/2018/01/health.png");
}
.energy-icon {
  background-image: url("../wp-content/uploads/2018/01/energy.png");
}
.pell-icon {
  background-image: url("../wp-content/uploads/2018/01/pell.png");
}

/* .teachers-icon {
  background-image: url("img/teachers_elementary.png");
}

.food-icon {
  background-image: url("img/soup_kitchen.png");
}

.health-icon {
  background-image: url("img/doctor_kid.png");
}

.energy-icon {
  background-image: url("img/wind-turbine.jpg");
}

.pell-icon {
  background-image: url("img/pellgrants.jpg");
} */

.content-wrapper {
  max-width: 1140px;
  margin-top: 2em;
  margin: auto;
  display: flex;
  flex-direction: column;
}

.map-holder-military-aid {
  position: relative;
  flex: 1;
}

/* Always set the map height explicitly to define the size of the div
     * element that contains the map. */

#map {
  height: 350px;
}

#map-tools {
  /*min-height:700px;*/
  flex: 1;
}

.alt-holder {
  display: flex;
  width: 100%;
  flex-direction: column;
  justify-content: space-between;
}

.alt-tile {
  flex: 1;
  margin: 2px;
  flex-direction: row;
  border: 1px solid #ccc;
  text-align: center;
  display: flex;
}
.alt-icon {
  background-size: cover;
}

.alt-number {
  font-size: 107%;
  padding: 5px;
  width: 70px;
  text-align: right;
  margin: auto 0;
}

.alt-text {
  margin: auto 0;
  font-size: 107%;
}

.icon-holder {
  flex: initial;
  flex: 0 0 50px;
  padding: 4px;
}

.alt-tile .alt-icon {
  padding-bottom: 100%;
  background-size: cover;
  /* background-repeat: no-repeat; */
}

@media only screen and (min-width: 500px) {
  #map {
    height: 625px;
    margin-left: 15px;
  }

  #map-tools {
    /*flex: 0 0 420px;*/
  }

  .alt-holder {
    flex-direction: row;
  }

  .alt-tile {
    flex: 1;
    flex-direction: column;
    text-align: center;
    padding: 5px;
    max-width: 140px;
    margin: 10px;
  }
  .icon-holder {
    display: block;
  }
  .alt-tile .alt-icon {
    padding-bottom: 100%;
  }
  .alt-number {
    font-size: 120%;
    font-weight: 600;
    text-align: center;
    margin: 0 auto;
    padding: 10px 0 0 0;
  }

  .alt-text {
    font-size: 95%;
    margin: 0;
    /* padding: 10px; */
    font-size: 105%;
    font-weight: 600;
    padding-top: 0px;
  }
}

@media only screen and (min-width: 1000px) {
  .alt-holder {
    flex-direction: column;
  }
  .content-wrapper {
    flex-direction: row;
  }

  #map-tools {
    flex: 1;
    max-width: 400px;
    /* display: flex; */
    /* max-height: 585px; */
    margin-left: 15px;
    flex-direction: column;
  }

  .alt-tile {
    flex: 1;
    margin: 10px;
    flex-direction: row;
    text-align: center;
    height: 62px;
    flex-grow: 0;
    max-width: 100%;
  }

  .icon-holder {
    padding-bottom: 0;
    flex: 0 0 50px;
  }
  .alt-tile .alt-icon {
    /*padding-bottom: 100%;*/
    flex: 0 0 50px;
  }

  .alt-text {
    text-align: left;
    padding: 0 0 0 7px;
    margin: auto 0;
  }

  .alt-number {
    width: 60px;
    width: 75px;

    text-align: right;
    padding: 0;
    margin: auto 0;
  }

  .state-details-holder,
  .current-infographic,
  .alt-holder {
    /* height: 100%; */
  }
  .alt-holder {
    /* max-height: 440px; */
  }
  .current-infographic {
    display: flex;
    flex-direction: column;
  }
}

.alt-expenditure {
  font-size: 110%;
}

[type="radio"]:checked,
[type="radio"]:not(:checked) {
  width: 100%;
  position: absolute;
  left: -9999px;
}
[type="radio"]:checked + label,
[type="radio"]:not(:checked) + label {
  position: relative;
  padding-left: 28px;
  padding-bottom: 5px;
  cursor: pointer;
  line-height: 20px;
  display: inline-block;
  color: #ffffff;
}
[type="radio"]:checked + label:before,
[type="radio"]:not(:checked) + label:before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 18px;
  height: 18px;
  border: 1px solid #ddd;
  border-radius: 100%;
  background: #fff;
}
[type="radio"]:checked + label:after,
[type="radio"]:not(:checked) + label:after {
  content: "";
  width: 12px;
  height: 12px;
  background: #f87da9;
  position: absolute;
  top: 4px;
  left: 4px;
  border-radius: 100%;
  -webkit-transition: all 0.2s ease;
  transition: all 0.2s ease;
}
[type="radio"]:not(:checked) + label:after {
  opacity: 0;
  -webkit-transform: scale(0);
  transform: scale(0);
}
[type="radio"]:checked + label:after {
  opacity: 1;
  -webkit-transform: scale(1);
  transform: scale(1);
}

#radio-box {
  border-radius: 2.5px;
  border: 1px solid #ccc;
}
@media only screen and (min-width: 500px) {
  #radio-box {
    position: absolute;
    background-color: rgba(255, 255, 255, 0.85);
    top: 70px;
    left: 10px;
    border-radius: 2.5px;
    border: 1px solid #ccc;
    z-index: 1;
  }
}
.level-heading {
  color: #000;
  background-color: #ccc;
  text-align: center;
  border-bottom: 1px solid #ccc;
  font-weight: 600;
}
.radio-holder {
  padding: 5px;
  font-size: 102%;
  border-bottom: 1px solid #ccc;
  border-right: 4px solid rgba(200, 200, 200, 0.7);
  background: rgba(0, 0, 0, 0.5);
}

.radio-holder.districts {
  border-right: 4px solid rgba(200, 0, 200, 0.7);
}

.radio-holder.counties {
  border-right: 4px solid rgba(0, 255, 0, 0.7);
}

.radio-holder.cities {
  border-right: 4px solid rgba(0, 0, 0, 0.7);
}

.radio-holder:last-child {
  border-bottom: none;
}
.radio-disabled label {
  color: #aba !important;
}

.info-window-container {
  text-align: center;
}
.info-window-container p {
  line-height: 1em;
}
.info-window-container .state-heading {
  font-size: 20px;

  margin-bottom: 0.2em;
  font-size: 26px;
}

.area-heading {
  font-size: 30px;
  margin-bottom: 0px;
  color: #000;
  line-height: normal;
  max-width: 318px;
}
.info-window__weapons-heading {
  font-size: 150%;
  line-height: 175%;
}
@media only screen and (min-width: 500px) {
  .info-window-container .state-heading {
    font-size: 22px;
  }
  .area-heading {
    font-size: 26px;
    max-width: 305px;
  }
}

.select-holder {
  display: flex;
  flex-direction: column;
}

.select-unit {
  width: auto;
  position: relative;
}
@media only screen and (min-width: 500px) {
  .select-unit {
    width: 150px;
  }
}

.select-unit select {
  max-width: 100%;
  margin-bottom: 0px;
  height: 33px;
}
.select-level-2 {
}
.select-unit.show-arrow:before {
  position: absolute;
  top: 5px;
  left: 4px;
  font-size: 11px;
  content: "\e64b";
  font-family: "themify";
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  z-index: 1;
}

.select-unit option {
  position: relative;
}

.weapons-heading {
  width: 100%;
  text-align: center;
  font-size: 23px;
  line-height: 27px;
  margin-top: 4px;
}

#info-download-btn {
  margin: auto;
  text-align: center;
}

.state-details-holder {
  flex: 1;
  flex-direction: column;
}

.radio-subheader {
  color: #000;
  background-color: #ccc;
  text-align: center;
  border-bottom: 1px solid #ccc;
  font-weight: 600;
  display: none;
}

.ralewaymedium {
  font-family: "ralewaymedium";
}
.ralewaysemi_bold {
  font-family: "ralewaysemi_bold";
}
