#boletim-coronavirus {
  height: 60px;
  background-color: #002C54;
}

#boletim-coronavirus .container {
  justify-content: space-between;
  align-items: center;
  height: 100%;
}

#boletim-coronavirus h1 {
  font-family: "Ford Antenna Regular";
  font-size: 1.3rem;
  color: #FFFFFF;
}

#boletim-coronavirus h1 span {
  font-size: .7rem;
}

#boletim-coronavirus .botoes a,
#infos-coronavirus a {
  font-family: "Ford Antenna Regular";
  font-size: 1rem;
  text-decoration: none;
  color: #7FFF00;
  border: 1.5px solid #7FFF00;
  border-radius: 15px;
  padding: 2px 15px;
  margin-right: 10px;
  transition: all .3s;
}

#boletim-coronavirus .botoes a:last-child,
#infos-coronavirus a:last-child {
  margin-right: 0;
}

#boletim-coronavirus .botoes a:hover,
#infos-coronavirus a:hover {
  color: #002C54;
  background-color: #FFFFFF;
  border: 1.5px solid #FFFFFF;
}

.modal {
  width: 100%;
  max-width: 1000px;
}

.modal table {
  text-align: center;
  width: 100%;
}

.modal thead {
  background-color: #f6f6f6;
}

.modal thead th {
  padding: 5px;
}

#infos-coronavirus {
  background-color: #06447D;
  padding: 35px 0;
}

#infos-coronavirus .contadores {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  width: 70%;
  border-right: 1px solid #FFFFFF;
}

#infos-coronavirus .contador {
  border: 1px solid #FFFFFF;
  display: flex;
  flex-direction: row;
  width: 30%;
  margin-right: 20px;
}

#infos-coronavirus .nome {
  border-right: 1px solid #FFFFFF;
  color: #FFFFFF;
  font-family: "Ford Antenna Regular";
  font-size: 1rem;
  padding: 15px 5px;
  width: 70%;
  text-align: center;
}

#infos-coronavirus .numero {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 30%;
  color: #FFFFFF;
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: 1.6rem;
}

#infos-coronavirus .vacinometro {
  width: 30%;
  display: flex;
  height: 100%;
  flex-wrap: wrap;
}

#infos-coronavirus .vacinometro div {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  text-align: center;
  width: 50%;
}

#infos-coronavirus span {
  color: #FFFFFF;
}

#infos-coronavirus .titulo {
  font-family: "Ford Antenna Regular";
  font-size: 1.2rem;
  margin-top: 20px;
}

#infos-coronavirus .doses-aplicadas {
  font-family: 'Montserrat', sans-serif;
  font-weight: 800;
  font-size: 2.6rem;
}

#infos-coronavirus .titulo-doses {
  font-family: "Ford Antenna Regular";
  font-size: 1rem;
}

#infos-coronavirus a {
  display: flex;
  align-items: center;
  margin-top: 15px;
  margin-left: 40px;
}

#noticias-acesso-rapido {
  margin-top: 30px;
}

#noticias-acesso-rapido .titulo-secao {
  margin-bottom: 40px;
}

#noticias-acesso-rapido .noticias {
  width: 70%;
  padding-right: 40px;
}

#noticias-acesso-rapido .noticia-principal {
  background-repeat: no-repeat;
  background-size: cover;
  height: 450px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 20px;
  text-decoration: none;
  position: relative;
}

#noticias-acesso-rapido .noticia-principal:hover h3 {
  text-decoration: underline #FFFFFF;
}

#noticias-acesso-rapido .noticia-principal::before {
  background: linear-gradient(rgba(0,0,0,0) 70%, rgba(0,0,0) 100%);
  content: '';
  display: block;
  height: 100%;
  width: 100%;
  position: absolute;
  bottom: 0;
  left: 0;
}

#noticias-acesso-rapido h4 {
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 1.3rem;
  color: #FFFFFF;
  background-color: #20CCF8;
  border-radius: 5px;
  width: max-content;
  padding: 7px 15px;
  margin-bottom: 15px;
}

#noticias-acesso-rapido h3 {
  font-family: Arial;
  font-weight: normal;
  font-size: 2rem;
  color: #FFFFFF;
  mix-blend-mode: lighten;
}

#noticias-acesso-rapido .noticias-secundarias {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 15px;
}

#noticias-acesso-rapido .noticias-secundarias a {
  display: flex;
  flex-direction: column;
  width: 49%;
  text-decoration: none;
}

#noticias-acesso-rapido .noticias-secundarias a:hover {
  text-decoration: underline;
}

#noticias-acesso-rapido .noticias-secundarias h5 {
  font-family: Arial;
  font-size: 1.3rem;
  font-weight: bold;
  color: #000000;
  margin-top: 5px;
}

#noticias-acesso-rapido .mais-noticias {
  display: flex;
  justify-content: flex-end;
  margin-top: 30px;
}

#noticias-acesso-rapido .mais-noticias a {
  background-color: #20CCF8;
  color: #FFFFFF;
  font-family: 'Roboto', sans-serif;
  font-weight: 400;
  font-size: 1.6rem;
  border-radius: 5px;
  text-decoration: none;
  padding: 10px;
  border: 2px solid transparent;
  transition: all .3s;
}

#noticias-acesso-rapido .mais-noticias a:hover {
  background-color: #FFFFFF;
  border: 2px solid #20CCF8;
  color: #20CCF8;
}

#noticias-acesso-rapido .acesso-rapido {
  width: 30%;
}

#noticias-acesso-rapido .acesso-rapido .links {
  display: flex;
  flex-direction: column;
}

#noticias-acesso-rapido .acesso-rapido .links a {
  width: 100%;
  height: 60px;
  display: flex;
  text-decoration: none;
  margin-bottom: 15px;
}

#noticias-acesso-rapido .acesso-rapido .links a:last-child {
  margin-bottom: 0;
}

#noticias-acesso-rapido .acesso-rapido .links a .icone {
  width: 20%;
  height: 100%;
  background-color: #008cbf;
  background-repeat: no-repeat;
  background-position: center;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all .3s;
}

#noticias-acesso-rapido .acesso-rapido .links a .texto {
  background-color: #00BBFF;
  width: 80%;
  height: 100%;
  display: flex;
  align-items: center;
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 1.3rem;
  color: #FFFFFF;
  transition: all .3s;
  padding-left: 30px;
}

#noticias-acesso-rapido .acesso-rapido .links a:hover .icone {
  background-color: #ca9a1f;
}

#noticias-acesso-rapido .acesso-rapido .links a:hover .texto {
  background-color: #F0BC39;
}

#banner-vacinacao {
  margin: 50px 0;
}

#banner-vacinacao a,
#banner-vacinacao img {
  width: 100%;
}

#banner-vacinacao .banner-mobile {
  display: none;
}

#servicos-online,
#publicacoes-oficiais {
  background-image: url('/common/default/img/textura.png');
  background-repeat: repeat;
  background-size: contain;
  padding-top: 30px;
}

#servicos-online .container {
  flex-direction: column;
}

#servicos-online h2,
#publicacoes-oficiais h2 {
  color: #000000;
}

#servicos-online h2 div,
#publicacoes-oficiais h2 div {
  font-family: 'Roboto', sans-serif;
  font-weight: 300;
  font-size: 3.2rem;
}

#servicos-online .servicos {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#servicos-online .servicos a {
  width: 24%;
  height: 200px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #00bbff;
  text-decoration: none;
  margin-bottom: 15px;
  transition: all .3s;
  text-align: center;
}

#servicos-online .servicos a:hover {
  background-color: #F0BC39;
}

#servicos-online .servicos a:nth-child(13),
#servicos-online .servicos a:nth-child(14),
#servicos-online .servicos a:nth-child(15),
#servicos-online .servicos a:nth-child(16) {
  /* margin-bottom: 0; */
}

#servicos-online .servicos img {
  max-width: 100px;
  width: 100%;
  margin-bottom: 10px;
}

#servicos-online .servicos h3 {
  font-family: 'Roboto', sans-serif;
  font-weight: 500;
  font-size: 1rem;
  color: #FFFFFF;
}

/* #servicos-online .servicos a:nth-child(12) h3 {
  font-size: .8rem;
} */

#publicacoes-oficiais {
  padding-top: 100px;
}

#publicacoes-oficiais .titulo-secao {
  margin-bottom: 120px;
}

#publicacoes-oficiais-form {
  margin-top: -50px;
}

#publicacoes-oficiais-form .container {
  flex-direction: column;
}

#publicacoes-oficiais-form .nav {
  width: 100%;
  height: 50px;
  display: flex;
  justify-content: space-between;
}

#publicacoes-oficiais-form h3 {
  height: 100%;
  width: 24%;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #f0bc39;
  border-radius: 10px 10px 0 0;
  color: #FFFFFF;
  cursor: pointer;
  font-family: Arial;
  font-size: 1.3rem;
  transition: all .3s;
  margin: 0 3px;
}

#publicacoes-oficiais-form h3.ativo,
#publicacoes-oficiais-form h3:hover {
  background-color: #FFFFFF;
  color: #F0BC39;
}

#publicacoes-oficiais-form form {
  display: none;
  justify-content: space-between;
  flex-wrap: wrap;
  padding: 50px 0;
}

#publicacoes-oficiais-form form.ativo {
  display: flex;
}

#publicacoes-oficiais-form label {
  display: flex;
  flex-direction: column;
  color: #2F2F2F;
  font-size: .9rem;
  margin-bottom: 20px;
}

#publicacoes-oficiais-form input,
#publicacoes-oficiais-form select {
  border: 1.5px solid #161616;
  border-radius: 5px;
  height: 30px;
  outline: none;
  padding: 0 5px;
  margin-top: 10px;
  color: #2F2F2F;
  background-color: #FFFFFF;
  font-family: Arial;
}

#publicacoes-oficiais-form input:focus,
#publicacoes-oficiais-form select:focus {
  border: 1.5px solid #F0BC39;
}

#publicacoes-oficiais-form form label:nth-child(1),
#publicacoes-oficiais-form form label:nth-child(2),
#publicacoes-oficiais-form form label:nth-child(3),
#publicacoes-oficiais-form form label:nth-child(4) {
  width: 380px;
}

#publicacoes-oficiais-form form label:nth-child(5),
#publicacoes-oficiais-form form label:nth-child(6) {
  width: 160px;
}

#publicacoes-oficiais-form button {
  background-color: #F0BC39;
  color: #FFFFFF;
  border-radius: 5px;
  height: 30px;
  max-width: 380px;
  width: 100%;
  border: none;
  cursor: pointer;
  margin-top: 25px;
  border: 1px transparent;
  transition: all .3s;
  font-family: Arial;
  font-size: 1.1rem;
}

#publicacoes-oficiais-form button:hover {
  background-color: #FFFFFF;
  color: #0D4AB3;
  border: 1px solid #0D4AB3;
}

#prefeitura-tv {
  padding: 40px 0;
  background-color: #f6f6f6;
}

#prefeitura-tv .container {
  flex-direction: column;
}

#prefeitura-tv .titulo {
  margin-bottom: 40px;
  max-width: 450px;
  width: 100%;
}

#prefeitura-tv .videos {
  display: flex;
  flex-wrap: wrap;
}

#prefeitura-tv .principal {
  width: 70%;
  padding-right: 30px;
}

#prefeitura-tv .principal:nth-child(2),
#prefeitura-tv .principal:nth-child(3),
#prefeitura-tv .principal:nth-child(4),
#prefeitura-tv .principal:nth-child(5) {
  display: none;
}

#prefeitura-tv .principal iframe {
  width: 100%;
  height: 479px;
}

#prefeitura-tv .principal h3 {
  font-size: 1.6rem;
  font-family: Arial;
  color: #000;
  font-weight: bold;
  margin-top: 10px;
}

#prefeitura-tv .principal h3 span {
  color: #1A1A1A;
  font-weight: normal;
}

#prefeitura-tv .outros {
  width: 30%;
}

#prefeitura-tv .outros a {
  display: flex;
  border-bottom: 2px solid #00B05E;
  padding: 15px 0;
  cursor: pointer;
  text-decoration: none;
}

#prefeitura-tv .outros a:first-child {
  padding-top: 0;
}

#prefeitura-tv .outros a:last-child {
  border: none;
}

#prefeitura-tv .outros a:hover h3 span {
  text-decoration: underline;
}

#prefeitura-tv .outros div {
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 50%;
  height: 96px;
}

#prefeitura-tv .outros h3 {
  font-size: 1.1rem;
  font-family: Arial;
  color: #000;
  font-weight: bold;
  margin-left: 10px;
  width: 50%;
}

#prefeitura-tv .outros h3 span {
  color: #1A1A1A;
  font-weight: normal;
}

#prefeitura-tv iframe {
  border: none;
}

#prefeitura-tv .botao {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  margin-top: -30px;
}

#prefeitura-tv .botao a {
  width: 140px;
  height: 30px;
  background-color: #00a844;
  border-radius: 10px;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  color: #FFFFFF;
  font-family: Arial;
  font-weight: bold;
  text-decoration: none;
  font-size: .9rem;
}

#prefeitura-tv .botao a img {
  max-width: 20px;
}

@media (max-width:768px) {
  #boletim-coronavirus {
    margin-top: 36px;
    height: 90px;
  }

  #boletim-coronavirus .container {
    flex-direction: column;
    justify-content: space-evenly;
  }

  #infos-coronavirus .contadores {
    width: 60%;
    border: none;
  }

  #infos-coronavirus .contador {
    width: 45%;
  }

  #infos-coronavirus .vacinometro {
    width: 40%;
  }

  #noticias-acesso-rapido .container {
    flex-wrap: wrap;
  }

  #noticias-acesso-rapido .noticias {
    width: 100%;
    padding: 0;
  }

  #noticias-acesso-rapido .acesso-rapido {
    width: 100%;
  }

  #banner-vacinacao .banner-desktop {
    display: none;
  }

  #banner-vacinacao .banner-mobile {
    display: block;
  }

  #servicos-online .servicos a {
    width: 32%;
  }

  #publicacoes-oficiais-form {
    margin-top: -42px;
  }

  #publicacoes-oficiais-form .nav {
    flex-direction: column;
    height: inherit;
  }

  #publicacoes-oficiais-form h3 {
    padding: 10px 0;
    border-radius: 0;
    margin-bottom: 5px;
    border: 2px solid transparent;
    width: 100%;
  }

  #publicacoes-oficiais-form h3.ativo {
    border: 2px solid #F0BC39;
  }

  #publicacoes-oficiais-form .concursos label,
  #publicacoes-oficiais-form button {
    width: 100% !important;
    max-width: inherit;
  }

  #publicacoes-oficiais-form form label {
    width: 49% !important;
  }

  #prefeitura-tv .principal {
    width: 100%;
    padding-right: 0;
  }

  #prefeitura-tv .outros {
    display: none;
  }

  #prefeitura-tv .botao {
    margin-top: 0;
  }
}

@media (max-width:576px) {
  #boletim-coronavirus {
    margin-top: 0;
    height: 200px;
  }

  #boletim-coronavirus h1 {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #boletim-coronavirus .botoes {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  #boletim-coronavirus .botoes a {
    margin-right: 0;
    margin-top: 10px;
  }

  #boletim-coronavirus .botoes a:first-child {
    margin-top: 0;
  }

  #noticias-acesso-rapido .noticia-principal {
    height: 300px;
  }

  #infos-coronavirus .container {
    flex-wrap: wrap;
  }

  #infos-coronavirus .contadores {
    width: 100%;
  }

  #infos-coronavirus .contador {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }

  #infos-coronavirus .contador:last-child {
    margin-bottom: 0;
  }

  #infos-coronavirus .vacinometro {
    width: 100%;
    margin-top: 20px;
  }

  #servicos-online .servicos a {
    width: 48%;
  }

  #servicos-online .servicos a:nth-child(11),
  #servicos-online .servicos a:nth-child(12),
  #servicos-online .servicos a:nth-child(13),
  #servicos-online .servicos a:nth-child(14),
  #servicos-online .servicos a:nth-child(15) {
    margin-bottom: 15px;
  }

  #prefeitura-tv .principal iframe {
    width: 100%;
    height: 210px;
  }
}