:root {
  --blue: #093768;
  --l-blue: #00acff;
}

body {
  background: rgb(0, 58, 120);
  background: linear-gradient(180deg, rgb(1, 59, 122) 0%, rgb(88, 158, 229) 70%);
  height: 104vh;
  font-family: "Montserrat", sans-serif;
  font-size: 18px;
  color: white;
  padding-top: 2rem;
}
body#ebape {
  background: url(../imgs/bg_ebape.jpg) center no-repeat;
  background-size: cover;
}

a {
  text-decoration: none;
}
a.ab {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.container {
  max-width: 1200px;
  margin: 0 auto;
  display: block;
  flex-wrap: wrap;
  position: relative;
}

.col {
  flex: 1;
  padding: 10px;
}

@media (max-width: 992px) {
  .col {
    flex-basis: 100%;
  }
}
@media (max-width: 768px) {
  .col {
    flex-basis: 50%;
  }
}
@media (max-width: 576px) {
  .col {
    flex-basis: 100%;
  }
}
.modal {
  background-color: rgba(16, 43, 72, 0.811);
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9;
  visibility: hidden;
  opacity: 0;
  transition: all 500ms ease;
}
.modal.active {
  opacity: 1;
  visibility: visible;
}

.form_modal {
  position: absolute;
  top: 13px;
  left: 50%;
  z-index: 999;
  transform: translate(-50%, 50%);
  visibility: hidden;
  transition: all 500ms ease;
  opacity: 0;
}
.form_modal.active {
  opacity: 1;
  visibility: visible;
}
.form_modal h3 {
  color: white;
  font-weight: 400;
  font-size: 30px;
  margin-bottom: 2rem;
  line-height: 37px;
}
.form_modal h3 strong {
  color: var(--l-blue);
  font-weight: normal;
}
.form_modal .box {
  background-color: var(--l-blue);
  padding: 1rem;
  border-radius: 20px;
  position: relative;
}
.form_modal .box span {
  text-transform: uppercase;
  font-weight: 700;
  font-size: 20px;
  margin-bottom: 1rem;
  display: block;
}
.form_modal .box span.close {
  position: absolute;
  cursor: pointer;
  top: 7px;
  right: 12px;
}
.form_modal .box label {
  display: block;
  font-size: 14px;
  margin-bottom: 4px;
}
.form_modal .box input {
  font-weight: 700;
  margin-bottom: 1rem;
  text-align: end;
}
.form_modal .box input[type=text], .form_modal .box input[type=password] {
  border-radius: 0;
  padding: 12px;
  border: 0;
  width: 215px;
  color: var(--blue);
}
.form_modal .box input[type=password] {
  width: 130px;
}
.form_modal .box button {
  background-color: var(--blue);
  color: white;
  border: 0;
  width: 70px;
  height: 70px;
  font-size: 18px;
  font-weight: 900;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 500ms ease;
}
.form_modal .box button:hover {
  background-color: var(--blue);
}
.form_modal .box .pass_sub {
  width: 100%;
  display: flex;
  justify-content: flex-start;
  gap: 16px;
}
.form_modal .box .pass_sub a {
  display: flex;
  align-items: center;
  margin-top: 0;
  font-size: 12px;
}
.form_modal .box .pass_sub a img {
  margin-right: 7px;
}
.form_modal .box a {
  color: white;
  font-weight: 700;
  font-size: 16px;
  display: inline-block;
  margin-top: 0.75rem;
}

.predio1,
.predio2,
.predio3,
.predio4,
.central,
.chao {
  position: absolute;
}

.chao {
  top: 50%;
  left: 50%;
  transform: translate(-50%, 50%);
}

.bubble {
  background: white;
  color: var(--blue);
  text-transform: uppercase;
  font-weight: 600;
  font-size: 13px;
  line-height: 41px;
  text-align: center;
  width: 101px;
  height: 41px;
  border-radius: 10px;
  padding: 0px;
  position: absolute;
  left: 2px;
  top: -25px;
}
.bubble a {
  color: var(--blue);
}
.bubble:after {
  content: "";
  position: absolute;
  display: block;
  width: 0;
  z-index: 1;
  border-style: solid;
  border-color: #fff transparent;
  border-width: 10px 10px 0;
  bottom: -8px;
  left: 50%;
  margin-left: -10px;
}

.ebap {
  background: transparent;
  width: 107px;
  height: 96px;
  position: absolute;
  left: 34%;
  top: 53%;
  z-index: 99;
  opacity: 0;
  transition: all 500ms ease;
}
.ebap:hover {
  opacity: 1;
}

.direito {
  background: transparent;
  width: 64px;
  height: 123px;
  position: absolute;
  left: 25%;
  top: 48%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.direito:hover {
  opacity: 1;
}

.cpdoc {
  background: transparent;
  width: 64px;
  height: 123px;
  position: absolute;
  left: 35%;
  top: 35%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.cpdoc:hover {
  opacity: 1;
}

.ecmi {
  background: transparent;
  width: 64px;
  height: 123px;
  position: absolute;
  left: 46%;
  top: 49%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.ecmi:hover {
  opacity: 1;
}
.ecmi .bubble {
  left: -20px;
  top: -30px;
}

.emap {
  background: transparent;
  width: 54px;
  height: 101px;
  position: absolute;
  left: 42%;
  top: 59%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.emap:hover {
  opacity: 1;
}
.emap .bubble {
  left: -20px;
  top: -30px;
  text-transform: none;
}

.epge {
  background: transparent;
  width: 89px;
  height: 83px;
  position: absolute;
  left: 34%;
  top: 68%;
  z-index: 999;
  opacity: 0;
  transition: all 500ms ease;
}
.epge:hover {
  opacity: 1;
}

.eppg {
  background: transparent;
  width: 89px;
  height: 83px;
  position: absolute;
  left: 42%;
  top: 27%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.eppg:hover {
  opacity: 1;
}

.educ {
  background: transparent;
  width: 89px;
  height: 131px;
  position: absolute;
  left: 61%;
  top: 18%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.educ:hover {
  opacity: 1;
}
.educ .bubble {
  width: 156px;
  left: -25px;
}

.eaesp {
  background: transparent;
  width: 89px;
  height: 108px;
  position: absolute;
  left: 62%;
  top: 44%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.eaesp:hover {
  opacity: 1;
}
.eaesp .bubble {
  left: -7px;
}

.direitosp {
  background: transparent;
  width: 89px;
  height: 108px;
  position: absolute;
  left: 70%;
  top: 51%;
  z-index: 999;
  opacity: 0;
  transition: all 500ms ease;
}
.direitosp:hover {
  opacity: 1;
}

.ri {
  background: transparent;
  width: 89px;
  height: 79px;
  position: absolute;
  left: 57%;
  top: 61%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.ri:hover {
  opacity: 1;
}

.eesp {
  background: transparent;
  width: 58px;
  height: 108px;
  position: absolute;
  left: 65%;
  top: 65%;
  z-index: 9;
  opacity: 0;
  transition: all 500ms ease;
}
.eesp:hover {
  opacity: 1;
}
.eesp .bubble {
  left: -19px;
}

.predios {
  position: absolute;
  top: -11%;
  transform: scale(0.9);
  left: 47%;
}
.predios .predio1 {
  top: 50%;
  left: 50%;
  transform: translate(-74%, 74%);
  z-index: 2;
}
.predios .predio2 {
  top: 50%;
  left: 50%;
  transform: translate(-60%, 165%);
  z-index: 1;
}
.predios .predio3 {
  top: 50%;
  left: 50%;
  transform: translate(66%, 90%);
  z-index: 1;
}
.predios .predio4 {
  top: 50%;
  left: 50%;
  transform: translate(31%, 119%);
  z-index: 1;
}
.predios .central {
  top: 50%;
  left: 50%;
  transform: translate(43%, 31%);
  z-index: 1;
}

p {
  line-height: 32px;
}

.texto_lateral {
  width: 400px;
}
.texto_lateral strong {
  font-weight: 700;
}
.texto_lateral .title_lateral {
  margin-top: 3rem;
  position: relative;
}
.texto_lateral .title_lateral::after {
  content: "";
  background: url(../imgs/dots_b.png) no-repeat;
  width: 100%;
  height: 6px;
  display: block;
  margin-block: 2rem;
}
.texto_lateral .title_lateral h2 {
  font-size: 28px;
  font-weight: 700;
  line-height: 34px;
  width: 80%;
}
.texto_lateral .map {
  font-size: 22px;
  width: 310px;
}
.texto_lateral .map::after {
  content: "";
  background: url(../imgs/dots_b_d.png) no-repeat;
  width: 100%;
  height: 6px;
  display: block;
  margin-block: 2rem;
}
.texto_lateral .map strong {
  color: var(--blue);
  font-weight: 700;
}

.nav {
  position: absolute;
  right: 0;
  top: 0;
  text-align: end;
  z-index: 9;
}
.nav .navegue::after {
  content: "";
  background: url(../imgs/dots_b.png) no-repeat;
  width: 335px;
  height: 6px;
  display: block;
  margin-block: 1rem;
}
.nav .navegue a {
  font-size: 20px;
  color: white;
  font-weight: 700;
}
.nav .navegue a img {
  margin-right: 1rem;
}
.nav.active .menu {
  height: 100%;
  visibility: visible;
  opacity: 1;
}
.nav .menu {
  height: 0;
  visibility: hidden;
  opacity: 0;
  transition: all 400ms ease-in;
}
.nav .menu ul li {
  margin-bottom: 0.8rem;
}
.nav .menu ul li:last-child {
  margin-bottom: 2rem;
}
.nav .menu ul li a {
  color: white;
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 600;
  display: inline-block;
  position: relative;
  -webkit-padding-end: 2rem;
          padding-inline-end: 2rem;
}
.nav .menu ul li a:after {
  content: "";
  background: url(../imgs/arrow_menu.png) no-repeat;
  position: absolute;
  right: 0;
  top: 5px;
  width: 21px;
  height: 10px;
  transform: rotate(-90deg);
  opacity: 0.3;
  transition: all 0.3s ease;
}
.nav .menu ul li a:hover:after, .nav .menu ul li a.active:after {
  transform: rotate(0);
  opacity: 1;
}
.nav .menu ul li ul {
  margin-block: 1rem;
  -webkit-margin-end: 1rem;
          margin-inline-end: 1rem;
}
.nav .menu ul li ul.submenu {
  display: none;
}
.nav .menu ul li ul.submenu.active {
  display: block;
}
.nav .menu ul li ul li {
  margin-bottom: 0.75rem;
}
.nav .menu ul li ul li a {
  font-size: 16px;
  color: var(--l-blue);
  transition: all 500ms ease;
  -webkit-padding-end: 0;
          padding-inline-end: 0;
  text-transform: initial;
}
.nav .menu ul li ul li a:after {
  display: none;
}
.nav .menu ul li ul li a:hover {
  color: white;
}
.nav .menu ul li ul li:last-child {
  margin-bottom: 0;
}
.nav .login {
  text-align: end;
}
.nav .login_btn {
  color: white;
  font-size: 20px;
  font-weight: 600;
  display: inline-block;
  position: relative;
}
.nav .login_btn img {
  -webkit-padding-end: 1rem;
          padding-inline-end: 1rem;
}
.nav .login_btn::after {
  content: "";
  background: url(../imgs/dots_b.png) no-repeat;
  width: 236px;
  height: 6px;
  display: block;
  margin-block: 1rem;
}
.nav .login_campos {
  height: 0;
  visibility: hidden;
}
.nav .login_campos.active {
  height: 100%;
  visibility: visible;
}
.nav .login_campos label {
  display: block;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 0.7rem;
}
.nav .login_campos input {
  font-weight: 700;
  margin-bottom: 1rem;
  text-align: end;
}
.nav .login_campos input[type=text], .nav .login_campos input[type=password] {
  border-radius: 10px;
  padding: 12px;
  border: 0;
  width: 215px;
  color: var(--blue);
}
.nav .login_campos input[type=password] {
  width: 130px;
}
.nav .login_campos button {
  background-color: #008bce;
  color: white;
  border: 0;
  width: 70px;
  height: 70px;
  font-size: 18px;
  font-weight: 900;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 500ms ease;
}
.nav .login_campos button:hover {
  background-color: var(--l-blue);
}
.nav .login_campos .pass_sub {
  width: 100%;
  display: flex;
  justify-content: flex-end;
  gap: 16px;
}
.nav .login_campos a {
  color: white;
  font-weight: 700;
  font-size: 16px;
  display: inline-block;
  margin-top: 0.75rem;
}

.logo h2 {
  font-weight: 900;
  font-size: 32px;
  margin-top: 10px;
}
.logo.interna {
  text-align: end;
  padding: 10px;
  background-color: white;
}
.logo.interna img {
  width: 315px;
}
.logo.interna h2 {
  color: #003b7c;
}

.ll h2 {
  font-weight: 900;
  font-size: 32px;
  margin-top: 10px;
  text-align: end;
}

.interna .nav {
  position: absolute;
  left: 0;
  right: inherit;
  top: 0;
  text-align: end;
  z-index: 9;
}
.interna .hamburger {
  position: absolute;
  left: 8px;
  z-index: 6;
  top: 5px;
  cursor: pointer;
}
.interna .hamburger .line {
  width: 30px;
  height: 4px;
  border-radius: 0;
  background-color: var(--blue);
  display: block;
  margin: 5px auto;
  transition: all 0.3s ease-in-out;
}

.breadcrumbs {
  margin-top: 1.7rem;
  margin-bottom: 1rem;
  margin-left: 0;
  font-size: 20px;
}
.breadcrumbs a {
  color: white;
}
.breadcrumbs span {
  font-weight: 700;
}

h2.sessao {
  margin-left: 0;
  font-size: 40px;
  font-weight: 800;
  color: white;
}

.barra_itens {
  background-color: rgba(0, 0, 0, 0.42);
  color: white;
  padding-block: 1rem;
  margin-top: 3rem;
  padding-inline: 1rem;
}
.barra_itens .cc {
  display: grid;
  grid-template-columns: 16% 16% 16% 16% 16% 16%;
  justify-content: space-between;
  gap: 10px;
  align-items: baseline;
}
.barra_itens .items {
  font-size: 16px;
  padding: 1rem 1rem;
  transition: all 500ms ease;
  position: relative;
}
.barra_itens .items h3 {
  transition: all 500ms ease;
}
.barra_itens .items:first-child h3 {
  border-bottom: #ffd744 8px solid;
}
.barra_itens .items:first-child:hover {
  background-color: #ffd744;
}
.barra_itens .items:first-child:hover h3 {
  border-bottom: white 8px solid;
}
.barra_itens .items:nth-child(2) h3 {
  border-bottom: #e28e04 8px solid;
}
.barra_itens .items:nth-child(2):hover {
  background-color: #e28e04;
}
.barra_itens .items:nth-child(2):hover h3 {
  border-bottom: white 8px solid;
}
.barra_itens .items:nth-child(3) h3 {
  border-bottom: #a4144f 8px solid;
}
.barra_itens .items:nth-child(3):hover {
  background-color: #a4144f;
}
.barra_itens .items:nth-child(3):hover h3 {
  border-bottom: white 8px solid;
}
.barra_itens .items:nth-child(4) h3 {
  border-bottom: #955490 8px solid;
}
.barra_itens .items:nth-child(4):hover {
  background-color: #955490;
}
.barra_itens .items:nth-child(4):hover h3 {
  border-bottom: white 8px solid;
}
.barra_itens .items:nth-child(5) h3 {
  border-bottom: #15af97 8px solid;
}
.barra_itens .items:nth-child(5):hover {
  background-color: #15af97;
}
.barra_itens .items:nth-child(5):hover h3 {
  border-bottom: white 8px solid;
}
.barra_itens .items:nth-child(6) h3 {
  border-bottom: #88a94a 8px solid;
}
.barra_itens .items:nth-child(6):hover {
  background-color: #88a94a;
}
.barra_itens .items:nth-child(6):hover h3 {
  border-bottom: white 8px solid;
}
.barra_itens .items img {
  width: 100px;
  text-align: end;
  display: block;
}
.barra_itens h3 {
  font-weight: 600;
  font-size: 17px;
  padding-bottom: 9px;
  padding-top: 11px;
  margin-bottom: 1rem;
}
.barra_itens p {
  font-size: 14px;
  line-height: 18px;
}

.menu_interno {
  background-color: #008bce;
  position: absolute;
  top: 0;
  width: 326px;
  height: 0;
  min-height: 0;
  visibility: hidden;
  opacity: 0;
  z-index: 9;
  padding: 1rem 2rem;
  box-shadow: 10px 10px 0px 0px rgba(17, 98, 166, 0.27);
  transition: all 500ms ease;
}
.menu_interno.active {
  min-height: 204px;
  height: auto;
  visibility: visible;
  opacity: 1;
}
.menu_interno span.m {
  text-transform: uppercase;
  position: relative;
  display: block;
  margin-bottom: 1rem;
}
.menu_interno .hamburger {
  position: absolute;
  right: 8px;
  left: initial;
  z-index: 6;
  top: 8px;
  cursor: pointer;
}
.menu_interno .hamburger .line {
  width: 30px;
  height: 4px;
  border-radius: 0;
  background-color: white;
  display: block;
  margin: 5px auto;
  transition: all 0.3s ease-in-out;
}
.menu_interno .login {
  text-align: start;
}
.menu_interno .login_btn {
  color: white;
  font-size: 20px;
  font-weight: 600;
  display: inline-block;
  position: relative;
}
.menu_interno .login_btn img {
  -webkit-padding-end: 1rem;
          padding-inline-end: 1rem;
}
.menu_interno .login_btn::after {
  content: "";
  background: url(../imgs/dots_b.png) no-repeat;
  width: 355px;
  height: 6px;
  display: block;
  margin-block: 1rem;
}
.menu_interno .login_campos {
  height: 0;
  visibility: hidden;
  display: grid;
  grid-template-columns: 41% 55%;
  gap: 12px;
}
.menu_interno .login_campos.active {
  height: 100%;
  visibility: visible;
}
.menu_interno .login_campos label {
  display: block;
  text-transform: uppercase;
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 0.7rem;
}
.menu_interno .login_campos input {
  font-weight: 700;
  text-align: start;
}
.menu_interno .login_campos input[type=text], .menu_interno .login_campos input[type=password] {
  border-radius: 10px;
  padding: 12px;
  border: 0;
  width: 110px;
  margin-bottom: 0;
  color: var(--blue);
}
.menu_interno .login_campos .sub {
  margin-top: 24px;
}
.menu_interno .login_campos button {
  background-color: var(--blue);
  color: white;
  border: 0;
  width: 45px;
  height: 42px;
  font-size: 18px;
  font-weight: 900;
  border-radius: 10px;
  cursor: pointer;
  transition: background-color 500ms ease;
}
.menu_interno .login_campos button:hover {
  background-color: var(--l-blue);
}
.menu_interno .login_campos .pass_sub {
  display: grid;
  grid-template-columns: 65% 50%;
  align-items: center;
  justify-content: space-between;
  gap: 28px;
}
.menu_interno .login_campos a {
  color: white;
  font-weight: 700;
  font-size: 16px;
  display: inline-block;
  margin-bottom: 1rem;
  width: 300px;
}
.menu_interno .nav {
  text-align: start;
  position: initial;
}
.menu_interno .nav a img {
  margin-right: 1rem;
}

.grid_content {
  display: grid;
  grid-template-columns: 25% 74%;
  gap: 10px;
  padding-top: 30px;
}
.grid_content .menu_lateral {
  position: relative;
  text-align: end;
  padding-right: 3rem;
}
.grid_content .menu_lateral:after {
  content: "";
  background: url(../imgs/linha_menu.png) no-repeat;
  position: absolute;
  right: 0;
  height: 100%;
  width: 10px;
  top: 0;
}
.grid_content .menu_lateral li a {
  text-transform: uppercase;
  color: white;
  width: 100%;
  font-weight: 800;
  font-size: 22px;
  display: inline-block;
  padding: 15px;
  transition: all 500ms ease;
}
.grid_content .menu_lateral li a:hover, .grid_content .menu_lateral li a.active {
  background: #008bce;
}
.grid_content .breadcrumbs {
  color: #008bce;
  font-size: 14px;
  margin-left: 0;
  margin-top: 0;
  margin-bottom: 2rem;
}
.grid_content .breadcrumbs a {
  color: #008bce;
}
.grid_content .breadcrumbs span {
  font-weight: 400;
}
.grid_content .breadcrumbs .atual {
  color: white;
}
.grid_content .menu_jornada ul {
  display: flex;
}
.grid_content .menu_jornada ul li {
  margin-right: 1rem;
}
.grid_content .menu_jornada ul li a {
  color: white;
  text-transform: uppercase;
  padding: 14px;
}
.grid_content .menu_jornada ul li a:hover, .grid_content .menu_jornada ul li a.active {
  background-color: var(--blue);
}
.grid_content .menu_jornada ul li:last-child {
  position: relative;
}
.grid_content .menu_jornada ul li:last-child:after {
  content: "";
  background: url(../imgs/linha_menu.png) no-repeat;
  position: absolute;
  left: -6px;
  height: 30px;
  width: 10px;
  top: -5px;
}
.grid_content .text {
  margin-top: 2rem;
  margin-left: 0;
}
.grid_content .text h2 {
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 8px;
}
.grid_content .text p {
  line-height: 24px;
}
.grid_content .menu_seletores {
  position: relative;
  top: 90px;
}
.grid_content .menu_seletores a.rotacao {
  background-color: var(--blue);
  color: rgba(255, 255, 255, 0.842);
  font-size: 20px;
  font-weight: 700;
  transform: rotate(319deg);
  display: inline-block;
  padding: 17px 53px 17px 27px;
  border-radius: 34px;
  position: absolute;
}
.grid_content .menu_seletores a.rotacao:nth-child(2) {
  background-color: var(--blue);
  color: white;
  right: 10%;
  min-width: 135px;
  top: -1px;
  transform: rotate(318deg);
}
.grid_content .menu_seletores a.rotacao.p-ls {
  right: 14px;
  top: 5px;
}
.grid_content .menu_seletores a.rotacao.p-last {
  right: -51px;
  top: 10px;
}
.grid_content .menu_seletores ul {
  display: flex;
  position: absolute;
  left: 31%;
  top: 50px;
  width: 100%;
}
.grid_content .menu_seletores ul:after {
  content: "";
  width: 340px;
  position: absolute;
  background: url(../imgs/dot_menu.png) no-repeat;
  left: 0;
  top: 34px;
  height: 4px;
  z-index: -1;
}
.grid_content .boxes {
  margin-top: 17rem;
}
.grid_content .boxes .contents {
  display: grid;
  grid-template-columns: 50% 50%;
  gap: 40px;
}
.grid_content .boxes p {
  line-height: 21px;
}
.grid_content .boxes .b2 .data::after {
  content: "";
  background: url(../imgs/d_data.png) no-repeat;
  width: 8px;
  height: 58px;
  display: block;
  position: absolute;
  bottom: 8px;
  left: -13px;
}
.grid_content .boxes .b2 div:first-child {
  padding-right: 6px;
}
.grid_content .boxes .b1 {
  color: white;
  border-radius: 20px;
  padding: 2rem;
  font-size: 16px;
}
.grid_content .boxes .b1 strong {
  font-weight: 500;
  color: var(--blue);
}
.grid_content .boxes .b1 a {
  color: white;
  display: inline-block;
  font-weight: 500;
  text-decoration: underline;
}
.grid_content .boxes #div1 .b1 {
  background-color: #ffd744;
}
.grid_content .boxes #div2 .b1 {
  background-color: #003b7c;
}
.grid_content .boxes #div3 .b1 {
  background-color: #fa8000;
}
.grid_content .boxes #div4 .b1 {
  background-color: #b20049;
}
.grid_content .boxes #div5 .b1 {
  background-color: #a059a1;
}
.grid_content .boxes #div6 .b1 {
  background-color: #00ae9a;
}
.grid_content .boxes .b2 {
  color: var(--blue);
  font-size: 18px;
  display: grid;
  grid-template-columns: 50% 50%;
  align-items: center;
  gap: 22px;
}
.grid_content .boxes .b2 h3 {
  font-size: 24px;
  font-weight: 800;
}
.grid_content .boxes .b2 .data {
  font-size: 55px;
  color: rgba(255, 255, 255, 0.704);
  position: relative;
}
.grid_content .boxes .b2 .data::after {
  content: "";
  background: url(../imgs/d_data.png) no-repeat;
  width: 8px;
  height: 58px;
  display: block;
  position: absolute;
  bottom: 8px;
  left: -20px;
}
.grid_content .boxes .b2 .data span {
  color: var(--blue);
  font-weight: 800;
}
.grid_content .boxes .b2 .data .alert {
  font-size: 16px;
  background-color: #a4144f;
  border-radius: 20px;
  color: white;
  width: -moz-max-content;
  width: max-content;
  text-align: end;
  padding: 10px 28px;
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 1rem;
  margin: 0 auto 1rem;
}

.menu_seletores .processo {
  position: absolute;
  width: 100%;
}
.menu_seletores .processo a.rotacao {
  background-color: white;
  color: #00acff;
  font-size: 20px;
  font-weight: 700;
  transform: rotate(318deg);
  display: inline-block;
  padding: 17px 31px 17px 27px;
  border-radius: 34px;
  position: absolute;
  left: -30px;
}
.menu_seletores .processo ul {
  display: grid !important;
  grid-template-columns: 10% 10% 10% 10% 10% 10% !important;
  position: initial !important;
  height: 100% !important;
  width: auto !important;
  margin-top: 2rem;
  margin-left: 7rem;
}
.menu_seletores .processo ul:after {
  content: "";
  width: 492px;
  position: absolute;
  background: url(../imgs/dot_menu.png);
  left: 14%;
  top: 75px;
  height: 4px;
  z-index: -1;
}
.menu_seletores .processo ul li {
  position: relative;
  width: -moz-max-content;
  width: max-content;
  display: flex;
  align-items: flex-start;
}
.menu_seletores .processo ul li.active span::before {
  border: 4px solid white;
}
.menu_seletores .processo ul li:nth-child(4) span {
  top: 14px;
}
.menu_seletores .processo ul li:nth-child(1) span::before {
  color: inherit;
  background-color: #ffd744;
}
.menu_seletores .processo ul li:nth-child(2) span::before {
  background-color: #003b7c;
}
.menu_seletores .processo ul li:nth-child(3) span::before {
  background-color: var(--checkin,#84a1bf);
}
.menu_seletores .processo ul li:nth-child(4) span::before {
  background-color: var(--prova,#84a1bf);
}
.menu_seletores .processo ul li:nth-child(5) span::before {
  background-color: var(--resultado,#84a1bf);
}
.menu_seletores .processo ul li:nth-child(6) span::before {
  background-color: var(--pre,#84a1bf);
}
.menu_seletores .processo ul li:nth-child(6) span {
  top: -12px;
}
.menu_seletores .processo ul li span {
  position: absolute;
  display: block;
  width: -moz-max-content;
  width: max-content;
  display: flex;
  align-items: center;
  gap: 8px;
  transform: rotate(-45deg);
  cursor: pointer;
}
.menu_seletores .processo ul li span::before {
  content: "";
  background: #84a1bf;
  color: #84a1bf;
  border-radius: 2rem;
  width: 22px;
  height: 22px;
  display: block;
  border: 4px solid transparent;
  transition: all 500ms ease;
}
.menu_seletores .processo ul li span:hover::before {
  border: 4px solid white;
}

#tour .text {
  margin-top: 3rem;
}
#tour .tour img {
  margin-top: 2rem;
}
#tour .tour span {
  display: block;
  text-transform: uppercase;
  font-weight: 700;
  font-size: 20px;
  position: relative;
  margin-top: 1rem;
}
#tour .tour span img {
  position: absolute;
  top: -14px;
  margin-top: 0;
  margin-left: 12px;
}
#tour .text_end {
  margin-top: 2.7rem;
  display: grid;
  grid-template-columns: 100%;
  gap: 40px;
  color: var(--blue);
  font-size: 14px;
  margin-bottom: 1rem;
}
#tour .text_end strong {
  font-weight: 700;
}
#tour .text_end p {
  line-height: 24px;
}

.busca {
  display: flex;
  flex-wrap: wrap;
  position: relative;
  margin-bottom: 2rem;
}
.busca::after {
  content: "";
  background: url(../imgs/dots_b.png) no-repeat;
  width: 100%;
  height: 6px;
  display: block;
  position: absolute;
  bottom: -18px;
}
.busca input[type=text] {
  background-color: white;
  border: 0;
  height: 30px;
  width: 81%;
  margin-right: 10px;
  padding-left: 1rem;
}
.busca button {
  background: transparent;
  border: 0;
}
.busca input::-moz-placeholder {
  color: #093768;
}
.busca input::placeholder {
  color: #093768;
}
.busca input::placeholder input::-webkit-input-placeholder {
  color: #093768;
}

.cc {
  display: flex;
  gap: 20px;
}

.box_user {
  margin-top: 1.5rem;
}
.box_user .user_info {
  background-color: white;
  color: #002e5f;
  width: 273px;
  text-align: center;
  border-radius: 2rem;
  padding: 2rem;
}
.box_user .name {
  font-size: 20px;
  width: 200px;
  margin: 0 auto;
}
.box_user .name span {
  font-size: 28px;
  display: block;
  font-weight: 500;
  margin-top: 0.75rem;
}
.box_user .photo {
  width: 179px;
  height: 179px;
  background-color: #c7d1dc;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 100%;
  margin: 0 auto;
  margin-bottom: 1rem;
}
.box_user .curso_ {
  margin-top: 1rem;
  width: 273px;
  color: white;
  font-size: 20px;
  background: #15af97;
  border-radius: 2rem;
  padding: 1rem 2rem;
}
.box_user .curso_ h3 {
  text-transform: uppercase;
  font-size: 20px;
  font-weight: 900;
}

.ct {
  display: flex;
  justify-content: space-between;
  margin-bottom: 1.8rem;
}

.box_infos {
  width: 100%;
}
.box_infos h3 {
  color: white;
  font-size: 26px;
  font-weight: 500;
  width: 429px;
  line-height: 33px;
  margin-top: 2rem;
  margin-bottom: 1.7rem;
}
.box_infos h3 strong {
  color: #51c6ff;
}
.box_infos .barra {
  padding: 2rem;
  background-color: rgba(255, 255, 255, 0.339);
  border-radius: 2rem;
}
.box_infos .barra .val1 {
  color: #002e5f;
  font-size: 60px;
  font-weight: bold;
}
.box_infos .barra .val2 {
  color: white;
  font-size: 60px;
  font-weight: bold;
}
.box_infos .barra_m {
  background-color: white;
  width: 100%;
  height: 20px;
  position: relative;
}
.box_infos .barra_m .arr {
  position: absolute;
  top: -20px;
  left: 17%;
}
.box_infos .barra_m .data {
  position: absolute;
  bottom: -24px;
  font-weight: bold;
  left: 17%;
}
.box_infos .val {
  width: 20%;
  height: 20px;
  background: #002e5f;
}

.tb {
  display: flex;
  gap: 20px;
  margin-top: 1rem;
}
.tb p {
  line-height: 24px;
}
.tb .vall {
  font-size: 80px;
  font-weight: 700;
  margin-top: 0.7rem;
}
.tb .disc {
  background: #a4144f;
  color: white;
  font-size: 18px;
  border-radius: 2rem;
  padding: 15px 25px;
}
.tb .discs {
  background: #002e5f;
  color: white;
  font-size: 18px;
  border-radius: 2rem;
  padding: 15px 25px;
}/*# sourceMappingURL=main.css.map */
.bg-gray {
  background-color: #222; // for example
}