/* audience.css */

/* Title bars  -------------------------------------------------------------- */
.title-bar {
    background-color: #c73d13;
}

.menu-active {
    border-bottom: 4px solid #c73d13 !important;
}

/* Man vs Woman counter */
.blue-large {
  font-size: 8em;
  color: #00b9e4;
  font-weight: bold;
}

.red-large {
  font-size: 8em;
  color: #d0103a;
  font-weight: bold;
}

/* Donuts ------------------------------------------------------------------- */
.pie .ct-label {
  fill: #ffffff;
  font-size: 1.3em;
}

.pie .ct-slice-donut-solid {
  stroke: white;
  stroke-width: 3px;
}

.pie .ct-series-a .ct-slice-donut-solid {
  fill: #e37222 !important;
  stroke: white;
  stroke-width: 3px;
}

.pie .ct-series-b .ct-slice-donut-solid {
  fill: #d0103a !important;
}

.pie .ct-series-c .ct-slice-donut-solid {
  fill: #681124 !important;
}

.pie .ct-series-d .ct-slice-donut-solid {
  fill: #5c7f92 !important;
}

.pie .ct-series-e .ct-slice-donut-solid {
  fill: #00b9e4 !important;
}

.pie .ct-series-f .ct-slice-donut-solid {
  fill: #005b82 !important;
}

/* Google map ------------------------------------------------------------------- */

.geochart {
  width: 800px; 
  height: 512px; 
  margin-left: auto;
  margin-right: auto;
}

#cities_div path,
#countries_div path {
  stroke-width: 3; /* control the countries borders width */
  stroke:#cccccc; /* choose a color for the border */
}

/* If the screen size is 1000px wide or less */
@media screen and (max-width: 900px) {
  .geochart {
    width: 300px; 
    height: 300px; 
  }
}