#text-header-reconhecimento {
    padding: 0;
}

.button-consultor-banner{
    color: #fff;
    background: #ce4f62;
}

#word-moodle {
    border-bottom: 5px solid #ce4f62;
}

#section-body, #section-03 {
    text-align: center;
}

.text {
    margin: 0px auto;
    width: 100%;
}

.boxes {
    margin: 30px auto;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.box {
    background: #fff;
    width: 334px;
    padding: 30px;
    margin-bottom: 20px;
    border-radius: 5px;
}

.box h3 {
    margin-top: 20px;
}

.box p {
    padding: 0px 30px;
}

#section-02 {
    display: flex;
    margin-bottom: 40px;
}

#left-content {
    background: #005897;
    width: 50%;
}

#left-content .container {
    padding: 40px 30px 40px 110px;
    color: #fff;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

#left-content h3 {
    color: #fff;
    text-transform: uppercase;
    padding-right: 50px;
}

#left-content p {
    width: 60%;
}

#right-content {
    width: 50%;
}

#right-content .container {
    display: flex;
    justify-content: space-between;
    padding: 0;
}

#right-content img {
    width: 45%;
    background: #fff;
}

.text-part {
    width: 50%;
    padding: 40px 110px 0px 0px;
}

.text-part h2 {
    color: #32728D;
}

#section-03 .text p {
    padding: 0px 20px;
}

#politicas-privacidade-div{
    margin-top: 100px;
}

div#politicas-privacidade-div p {
    font-size: 10px;
}

.my-row{
    display: flex;
    flex-wrap: wrap;
    margin-right: -15px;
    margin-left: -15px;
    justify-content: space-evenly;
    align-items: center;
    flex-direction: row;
}
.my-row div{
    width: 45%;
}

.my-row div img{
    width: 85%;
    border-radius: 3px;
    box-shadow: 5px 5px 5px rgb(0 0 0 / 36%);
}

.test-face {
    display: none;
}

#test {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-evenly;
}

#first-image img, #two-image img {
    width: 90%;
}

#video {
    box-shadow: 1px 1px 20px rgba(0, 0, 0, 0.3);
}

@media (min-width: 280px) and (max-width: 449px){

    #section-01-reconhecimento{
        background: #002138;
        text-align: left;
        padding: 0 !important;
    }

    #section-01-reconhecimento h1{
        margin-top: 40px;
    }

    .degrade {
        background: linear-gradient(90deg, rgba(0,0,0,0.8) 25%, rgba(0,0,0,0) 80%, rgba(0,0,0,0) 100%) !important;
    }

    .img-mobile {
        display: initial;
    }

    #section-services {
        display: flex;
        flex-wrap: wrap;
        max-width: 200px;
    }

    .services-single {
        display: flex;
        flex-wrap: wrap;
    }

    #left-content .container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    #left-content h3 {
        padding: 0;
    }

    .text-button a {
        margin-bottom: 20px;
    }

    #left-content p {
        width: 100%;
    }

    #right-content {
        width: 100%;
    }

    #right-content img {
        display: none;
    }

    #right-content .text-part {
        text-align: center;
        margin: 10px auto;
        padding: 30px 0;
    }

    /* .servico-02 {
        display: none !important;
    } */

    .servico-02-mobile {
        display: block !important;
    }

}

@media (min-width: 450px) and (max-width: 744px){
    #section-01-reconhecimento{
        background: url('../img/reconhecimento_facial_final_medium.png') no-repeat center center / cover;
    }

    #left-content .container {
        flex-direction: column;
        align-items: center;
        text-align: center;
    }

    #left-content h3 {
        padding: 0;
    }

    .text-button a {
        margin-bottom: 20px;
    }

    #left-content p {
        width: 100%;
    }

    #right-content {
        width: 100%;
    }

    #right-content img {
        display: none;
    }

    #right-content .text-part {
        text-align: center;
        margin: 10px auto;
        padding: 30px 0;
    }
    
    /* .servico-02 {
        display: none !important;
    } */

    .servico-02-mobile {
        display: block !important;
    }

}

@media (max-width: 760px){
    .boxes {
        flex-direction: column;
    }

    .box {
        width: 100%;
        padding: 30px;
        margin-bottom: 20px;
        text-align: left;
    }

    .box p {
        padding: 0;
    }

    #left-content .container {
        padding: 30px;
    }

    #right-content {
        width: 100%;
    }

    #right-content img {
        display: none;
    }

    #right-content .text-part {
        width: 80%;
        text-align: center;
        margin: 10px auto;
        padding: 30px 0;
    }
}

@media (min-width: 772px){
    #text-description-banner h1 {
        width: 560px;
    }
}

@media (min-width: 991px) and (max-width: 1199px){
    .boxes {
        justify-content: space-evenly;
    }
}

@media (max-width: 1072px){
    #section-02 {
        flex-direction: column;
    }

    #left-content {
        width: 100%;
    }

    #right-content {
        width: 100%;
    }

    #right-content img {
        display: none;
    }

    #right-content .text-part {
        text-align: center;
        margin: 10px auto;
        padding: 30px 0;
    }
}

.input-file {
    border: 1px solid #005897 !important;
    border-radius: 25px;
}

.detalhe-upload {
    display: none;
}

.detalhe-upload-img {
    display: none;
}

#analisarFoto {
    display: none;
}

.carregando {
    display: none;
} 

.carregando-detalhes {
    display: none;
}

.loader {
    width: 60px;
    aspect-ratio: 1;
    display: flex;
    animation: l8-0 2s infinite sptes(1);
    margin-left: auto; /* Centraliza horizontalmente */
    margin-right: auto; /* Centraliza horizontalmente */
  }
  .loader::before,
  .loader::after {
    content: "";
    flex: 1;
    animation: 
      l8-1 1s infinite linear alternate,
      l8-2 2s infinite steps(1) -.5s;
  }
  .loader::after {
    --s:-1,-1;
  }
  @keyframes l8-0 {
    0%  {transform: scaleX(1)  rotate(0deg)}
    50% {transform: scaleX(-1) rotate(-90deg)}
  }
  @keyframes l8-1 {
    0%,
    5%   {transform:scale(var(--s,1)) translate(0px)   perspective(150px) rotateY(0deg) }
    33%  {transform:scale(var(--s,1)) translate(-10px) perspective(150px) rotateX(0deg) }
    66%  {transform:scale(var(--s,1)) translate(-10px) perspective(150px) rotateX(-180deg)}
    95%,
    100% {transform:scale(var(--s,1)) translate(0px)   perspective(150px) rotateX(-180deg)}
  }
  @keyframes l8-2 {
    0%  {background:#005897}
    50% {background:#eba238}
  }


/* INICIO - reconhecimento de voz */

.button_inactive {
  background-color: #fff;
  border: 2px solid #005897;
  color: #005897;

  outline: none;
}

.button_inactive:hover {
  background-color: #005897;
  color: #fff;

  cursor: pointer;
}


.button_active {
  background-color: #8b0000;
  border: 2px solid #8b0000;
  color: #fff;
}

#recordMicStop {
  font-weight: 500;
  font-size: 0.8750rem;
  background-color: white;
  color: #eba238;
  border: 2px solid #eba238;
  cursor: pointer;
}

#recordMicStop:hover {
  background-color: #eba238;
  color: white;
}

.disabled {
  opacity: 0.5;
}

.list button {
  height: 30px;
  width: 100px;

  margin: 5px;
}

#delete {
  display: flex;
  width: auto;
  align-items: center;
  padding: 5px;
  font-weight: 500;
  font-size: 0.8750rem;  
  background-color: white;
  color: #eba238;
  border: 2px solid #eba238;
  cursor: pointer;
}

#delete:hover {
  background-color: #eba238;
  color: white;
}

.list {
  margin: 0 auto;

  display: grid;
  justify-content: center;
  align-items: center;
}

.list .clip {
  margin: 0.625rem;
  width: 18.75rem;
  text-align: center;

  background-color: #fff;
  border-left: 4px solid #eba238;
  border-radius: 0.5rem;
  
  padding: 0.25rem;
}

.list .clip > .audio_opt {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;

  margin: 0.3125rem;
}

.list .clip .audio_opt > p {
  margin: 0;
  padding: 0.25rem;

  font-weight: 500;
  font-size: 0.8750rem;
}

.list .clip .audio_opt > p,
.list .clip .audio_opt > button {
  display: inline-block;
  font-weight: 500;
  font-size: 0.8750rem;
}

.resultado_api {
  text-align: left;
}

.resultado_api p {
  word-wrap: break-word;
  word-break: break-all;
  text-align: left;
  margin: 0.3125rem 0;
  padding-left:0.625rem;
  font-size: 1rem;
}

audio::-webkit-media-controls-panel {
  background-color: #fff;
}

@media screen and (max-width: 1200px) {
  .list {  
    grid-template-columns: repeat(2, 1fr);
  }
}


@media screen and (max-width: 800px) {

  .list {  
    grid-template-columns: auto;
  }
}

.voice-test {
    display: none;
}

/* FIM - reconhecimento de voz */