/*.fa-facebook,
.fa-twitter,
.fa-link {
  font-size: 1.5rem;
}*/

.oesp {
  top: 0;
}

.site-header {
  /*background: #f4f4f4;*/
}

.topbar {
  align-items: center;
  margin-bottom: 0;
}

.topbar i {
  color: #006194;
}

.brandbar {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
}

.entry-content {
  padding: 0 1.2rem;
}

.entry-header {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  /*max-width: 96rem;*/
  margin: 0 auto 6.8rem;
  /*padding: 4.2rem 0 1.2rem;*/
  padding: 4.2rem 1.2rem 1.2rem;
  /*background: #f4f4f4;*/
}

.entry-graph {
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 100%;
  max-width: 144rem;
  margin: auto;
}

.graph-circle-packing-canvas {
  margin-top: 5.4rem;
}

.kicker {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  max-width: 55rem;
  margin-bottom: 1.2rem;
  font-size: 1.8rem;
  font-weight: 700;
  text-transform: uppercase;
  color: #5C869C;
}

.entry-header .kicker {
  justify-content: center;
}

.kicker hr {
  width: 0;
  height: 1.6rem;
  margin: 0 .8rem;
  display: inline-block;
}

.entry-title {
  width: 100%;
  max-width: 96rem;
  margin: 0;
  margin-top: 1.2rem;
  margin-bottom: 5.4rem;
  font-size: 7.6244rem;
  line-height: 1.1;
}

h2 {
  width: 100%;
  max-width: 55rem;
  margin: 0;
  margin-bottom: 5.4rem;
  font-family: 'Estado Headline';
  font-size: 4.7123rem;
  line-height: 1.2;
}

.lead {
  width: 100%;
  max-width: 55rem;
  margin: 0;
  margin-bottom: 5.4rem;
  font-size: 2.9124rem;
  line-height: 1.5;
  font-weight: 700;
  opacity: .54;
}

p,
.where-am-i {
  width: 100%;
  max-width: 55rem;
  -webkit-margin-before: 0em;
  -webkit-margin-after: 0em;
  margin-bottom: 2.7rem;
  font-size: 1.8rem;
  line-height: 3.2rem;
  opacity: .87;
}

p:last-of-type {
  margin-bottom: 5.4rem;
}

hr {
  width: 100%;
  margin: 5.4rem auto;
  border: .1rem solid #000;
  opacity: .12;
}

iframe {
  height: 0;
  border: none;
  overflow: hidden;
}

/* nav */ 

header nav {
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  width: 100%;
  max-width: 55rem;
  margin-bottom: 5.4rem;
}

header nav span {
  display: inline-block;
}

header nav .select-style {
  margin: 0 1.2rem;
}


/* select */

.one-column {
  width: 100%;
  max-width: calc( 90rem / 4);
}

.select-style {
  height: 3.6rem;
  line-height: 3.6rem;
  white-space: nowrap;
}

.select-style select{
  height: 3.6rem;
  line-height: 3.6rem;
  padding-top: 0;
  white-space: nowrap;
}

.select-style {
  padding: 0;
  border: .1rem solid #c5c5c5;
  border-radius: .1rem;
  overflow: hidden;
  background-color: #fff;
  background: #fff url( '../chart/mapa-prefeitos/img/arrowdown.svg' ) no-repeat calc( 100% - 1.5rem ) center;
  background-size: 1.8rem;
  font-size: 1.4rem;
  line-height: 3.2rem;
  margin-bottom: 1rem;

  display: inline-block;

}

.select-style select,
.select-style input,
.select-style datalist {
  font-family: 'Lato', sans-serif !important;
  font-size: 1.4rem;
  padding: .5rem .8rem;
  width: calc( 100% + 2.5rem );
  border: none;
  box-shadow: none;
  background-color: transparent;
  background-image: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.select-style select:focus {
  outline: none;
}

.select-style {
  height: 3.6rem;
  line-height: 3.6rem;
  white-space: nowrap;
}

.select-style select{
  height: 3.6rem;
  line-height: 3.6rem;
  padding-top: 0;
  white-space: nowrap;
}

/* loader */

.loader {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 55rem;
  margin-bottom: 5.4rem;
  padding: 1.2rem;
  background: #f5f5f5;
}

.loader span {
  margin-left: 1rem;
  font-size: 1.1125rem;
  font-weight: bold;
  text-transform: uppercase;
  opacity: .54;
}

@-webkit-keyframes spin {

  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }

}

@keyframes spin {

  0% {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }

}

.loading-icon {
  border-radius: 50%;
  width: 2.4rem;
  height: 2.4rem;
  border: 0.25rem solid #ddd;
  border-top-color: #333;
  display: inline-block;
  margin: 0 .8rem;

  -webkit-animation-name: spin;
  -webkit-animation-duration: 1s;
  -webkit-animation-iteration-count: infinite;

  animation-name: spin;
  animation-duration: 1s;
  animation-iteration-count: infinite;
}

.gravity {
  -webkit-animation-timing-function: linear;
  animation-timing-function: linear;
}

/* footer */

footer {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #3A3C41;
  color: #808080;
  margin-top: 5.4rem;
  opacity: 0;
}

footer .oesp-estadao-symbol {
  font-size: 7.2rem;
  padding: 5.4rem;
}

/* screen reader */

.sr-only {
  position: absolute;
  margin: -.1rem;
  border: 0;
  padding: 0;
  width: .1rem;
  height: .1rem;
  overflow: hidden;
  clip: rect( 0, 0, 0, 0 );
}

.sr-only-focusable:active, .sr-only-focusable:focus {
  position: static;
  margin: 0;
  width: auto;
  height: auto;
  overflow: visible;
  clip: auto;
}

/* isolated charts */

.isolated .entry-header,
.isolated .entry-content hr {
  display: none;
}

/* meida queries */

@media (max-width: 550px) {
  .entry-title {
    /*font-size: 6.7773rem;*/
    font-size: 5.8rem;
  }
  h2 {
    font-size: 4.1887rem;
  }
  .lead {
    font-size: 2.5888rem;
  }
  p,
  .where-am-i {
    font-size: 1.6rem;
    line-height: 2.6rem;
  }
}