@import url('http://fonts.cdnfonts.com/css/geometria');

.nptitle {
  width: 1200px;
  margin: 0 auto;
}
.npcontent {
    width: 1200px;
    margin: 60px auto 40px auto;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    font-family: 'Geometria', sans-serif;
    justify-content: center;
    row-gap: 35px;
    column-gap: 45px;
}

.npcontent .npcontent__more {
    width: 100%;
    height: 70px;
    background-color: #71c1f2;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    text-transform: uppercase;
    font-size: 20px;
    color: white;
    font-weight: bold;
}

.npcontent .npcontent__block {
    width: 265px;
    border-radius: 10px;
    background-color: #e7ebef;
    display: flex;
    flex-direction: column;
    padding: 10px;
}

.npcontent .npcontent__block .npcontent__block-img:hover .sharebuttons {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
}

.npcontent .npcontent__block .npcontent__block-img {
    width: 100%;
    height: 145px;
    position: relative;
}

.npcontent .npcontent__block .npcontent__block-img .sharebuttons {
    width: 100%;
    height: 100%;
    opacity: 0.9;
    background-color: #032d4c;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
}

.npcontent .npcontent__block .npcontent__block-img .sharebuttons button {
    background: none;
    border: none;
    cursor: pointer;
}

.npcontent .npcontent__block .npcontent__block-img img {
    width: 100%;
    height: 100%;
    object-fit: fill;
}

.npcontent .npcontent__block .npcontent__block-text {
    text-decoration: none;
}

.npcontent .npcontent__block .npcontent__block-text h2 {
    font-size: 14px;
    color: #062545;
    font-weight: bold;
    margin: 10px 0px;
}

.npcontent .npcontent__block .npcontent__block-text p {
    font-size: 11px;
    color: black;
    font-weight: 500;
}

.npcontent .npcontent__block .npcontent__block-img .extrabuttons {
  display: flex;
  justify-content: space-between;
  position: absolute;
  z-index: 2;
  top: 10%; 
  left: 0;
  width: 100%;
  align-items: center;
}

.npcontent .npcontent__block .npcontent__block-img .extrabuttons .extrabuttons__lancamento {
  width: 100px;
  height: 15px;
  background-color: #71c1f2;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
  display:flex;
  justify-content: center;
  align-items: center;
  color: white;
  text-transform: uppercase;
}

.npcontent .npcontent__block .npcontent__block-img .extrabuttons .extrabuttons__fire {
  width: 25px;
  height: 25px;
  background-color: white;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media only screen and (max-width: 500px) {
    .npcontent {
        width: 80%;
        display: flex;
        flex-direction: column;
        flex-wrap: nowrap;
        gap: 40px;
        justify-content: center;
        align-items: center;
    }
    .npcontent .npcontent__block {
        width: 100%;
        height: 300px;
    }
    .npcontent .npcontent__block .npcontent__block-text h2 {
        font-size: 17px;
        margin: 20px 0px;
    }
    
    .npcontent .npcontent__block .npcontent__block-text p {
        font-size: 14px;
    }
    .nptitle {
      width: 80%;
    }
}

.structure.inner .media-display.mediainner picture img {
  display: none;
}

.mediainner {margin-bottom: 400px;}
.mediainner .blog-posts{bottom: auto;}

#loader {
    position: fixed;
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 100vh;
    margin: 0;
    background: #123b63;
    top: 0px;
    left: 0px;
    width: 100%;
    z-index: 2000;
}
.clock-loader {
    --clock-color: white;
    --clock-width: 4rem;
    --clock-radius: calc(var(--clock-width) / 2);
    --clock-minute-length: calc(var(--clock-width) * 0.4);
    --clock-hour-length: calc(var(--clock-width) * 0.2);
    --clock-thickness: 0.2rem;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: var(--clock-width);
    height: var(--clock-width);
    border: 3px solid var(--clock-color);
    border-radius: 50%;
  }
  .clock-loader::before,
  .clock-loader::after {
    position: absolute;
    content: "";
    top: calc(var(--clock-radius) * 0.25);
    width: var(--clock-thickness);
    background: var(--clock-color);
    border-radius: 10px;
    transform-origin: center calc(100% - calc(var(--clock-thickness) / 2));
    animation: spin infinite linear;
  }
  .clock-loader::before {
    height: var(--clock-minute-length);
    animation-duration: 2s;
  }
  .clock-loader::after {
    top: calc(var(--clock-radius) * 0.25 + var(--clock-hour-length));
    height: var(--clock-hour-length);
    animation-duration: 15s;
  }
  @-moz-keyframes spin {
    to {
      transform: rotate(1turn);
    }
  }
  @-webkit-keyframes spin {
    to {
      transform: rotate(1turn);
    }
  }
  @-o-keyframes spin {
    to {
      transform: rotate(1turn);
    }
  }
  @keyframes spin {
    to {
      transform: rotate(1turn);
    }
  }
    
  html .content.app-content{
    padding: calc(2rem + 5rem + 1.3rem) 2rem 0
  }
  @media (max-width: 767.98px){
    html body .app-content {
        padding: calc(3rem - 0.8rem + 6rem + 1.3rem) calc(2rem - 0.8rem) 0 calc(2rem - 0.8rem) !important;
    }
  }
  

  .datareturn {
    margin: 10px 0;
    color: red;
    padding: 10px;
}

  form.searchform{
    height: initial!important;
  }
  form.searchform input {
    height: initial!important;
    border: none;
    font-size: initial!important;
    width: 90%!important;

}

/* < Página de Cadastro */

.cadastro {
  text-align: center;
  width: 400px;
  margin: 23rem auto 15rem;
}

.cadastro h1 {
  font-size: 3rem;
  font-weight: 900;
  color: #062545;
  border-bottom: #fdb813 solid 0.3rem;
  padding-bottom: 15px;
  margin-bottom: 20px;
}

.cadastro-itens {
  border-radius: 4px;
  background-color: #e8ecf0;
  padding-top: 7rem;
  padding-bottom: 5rem;
  color: rgb(88, 88, 88);
  font-weight: 600;
  margin: 1rem auto 0;
}


.cadastro-itens p{
  display: flexbox;
  text-align: left;
  margin-left: 15%;
}

.itens-size{
  font-size: 1.5rem;
}

.cadastro-itens input{
  border-style: none;
  margin-bottom: 1rem;
  margin-top: 1rem;
  width: 70%;
  border-radius: 6px;
}

.cadastro-itens input.botao-cadastro{
  margin-top: 30px;
  border-style: none;
  background-color: #fdb813;
  color: white;
  width: 30%;
  padding: 10px;
  font-size: 1.5rem;
  cursor: pointer;
  transition: all .3s;
}

.cadastro-itens input.botao-cadastro:hover{
  background-color: #092c50;
  color: #fdb813;
  font-weight: 700;
}

.cadastro-itens p.entrar a{
  text-decoration: underline;
  transition: all .3s;
}

.cadastro-itens p.entrar a:hover{
  color: #fdb813;
  font-weight: 600;
}

/* Página de Cadastro >/ */

/* </ página de Login*/

.login {
  text-align: center;
  width: 400px;
  margin: 23rem auto 15rem;
}

.login h1 {
  font-size: 3rem;
  font-weight: 900;
  color: #062545;
  border-bottom: #fdb813 solid 0.3rem;
  padding-bottom: 15px;
  margin-bottom: 20px;
}

.login-itens {
  display: flex;
  padding: 10px;
  width: 100%;
  height: 100%;
  font-size: 1.5rem;
  font-weight: bold;
  background-color: #e8ecf0;
  color: rgb(88, 88, 88);
}

.login-itens input{
  margin: 7.5px 0px 20px 0px;
}

.login-itens .datareturn {
  margin: 0;
}

.login-itens a {
  font-size: 1.25rem;
}

.login-itens input.botao-login{
  background-color: #fdb813;
  border: 1px solid #fdb813;
  text-transform: uppercase;
  color: white;
  font-weight: bold;
  margin-bottom: 5px;
  transition: all .3s;
}

.login-itens input.botao-login:hover{
  background-color: white;
  color: #fdb813;
}

/* página de Login >/ */

/* </ página de Recuperação de Senha*/

.recuperar {
  text-align: center;
  width: 400px;
  margin: 23rem auto 15rem;
}

.recuperar h1 {
  font-size: 3rem;
  font-weight: 900;
  color: #062545;
  border-bottom: #fdb813 solid 0.3rem;
  padding-bottom: 15px;
  margin-bottom: 20px;
}

.recuperar-itens {
  display: flex;
  padding: 10px;
  width: 100%;
  height: 100%;
  font-size: 1.5rem;
  font-weight: bold;
  background-color: #e8ecf0;
  color: rgb(88, 88, 88);
  flex-direction: column;
  align-items: center;
}

.recuperar-itens p{
  margin: 10px auto;
  width: 90%;
}

.recuperar-itens input{
  margin: 5px 0px 20px 0px;
}

.recuperar-itens input.botao-recuperar{
  margin-top: 20px;
  border-style: none;
  background-color: #fdb813;
  color: white;
  width: 100%;
  padding: 10px;
  font-size: 10px;
  cursor: pointer;
  transition: all .3s;
  font-weight: 900;
  margin: 0;
  border: 1px solid #fdb813;
  margin-bottom: 20px;
}
.recuperar-itens .datareturn {
  margin: 0;
}

.recuperar-itens input.botao-recuperar:hover{
  background-color: white;
  color: #fdb813;
  font-weight: 700;
}

/* página de Recuperação de Senha >/ */

/* </ página de Recuperação de Senha*/

.redefinir {
  text-align: center;
  width: 400px;
  margin: 23rem auto 15rem;
}

.redefinir h1 {
  font-size: 3rem;
  font-weight: 900;
  color: #062545;
  border-bottom: #fdb813 solid 0.3rem;
  padding-bottom: 15px;
  margin-bottom: 20px;
}

.redefinir h2 {
  font-size: 1.4rem;
  font-weight: 900;
  color: #062545;
  margin-bottom: 30px;
  width: 50%;
  text-align: center;
  margin: 2rem 0rem;
  margin-bottom: 1rem;
}

.redefinir-itens {
  border-radius: 4px;
  margin: 1rem auto 0;
  background-color: #e8ecf0;
  color: rgb(88, 88, 88);
  font-weight: 600;
  width: 100%;
  padding: 1rem;
}

.redefinir-itens .itens-size {
  font-size: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.redefinir-itens .itens-size input {
  margin: 5px 0px 20px 0px;
}

.redefinir-itens .itens-size .botao-redefinir {
  background-color: #fdb813;
  color: white;
  text-transform: uppercase;
  font-weight: bold;
  cursor: pointer;
  border: 1px solid #fdb813;
  transition: all .3s;
}

.redefinir-itens .itens-size .botao-redefinir:hover {
  background-color: white;
  color: #fdb813;
}

.redefinir-itens .itens-size .datareturn {
  margin: 0;
}

/* página de Recuperação de Senha >/ */
.first-section.media-highlights .pagetitle {
  width: 35%;
  font-family: 'Geometria', sans-serif;
  font-size: 30px;
  text-align: flex-start;
  color: #032d4c;
  text-transform: uppercase;
  font-weight: bolder;
  padding-top: 3rem;
  border-bottom: 2px solid #fdb813;
  padding-bottom: 10px;
}
.first-section.media-highlights ul {
  margin: 10px auto;
  width: 1200px;
  display: flex;
  justify-content: flex-start;
  text-transform: uppercase;
  font-family: 'Geometria', sans-serif;
  font-size: 12.5px;
  color: #123b63;
  font-weight: 500;
}
.first-section.media-highlights ul li:first-child::after {
  content: '|';
  margin: 0px 10px;
}
.blog-posts .highlighted div.text {
  width: 50%;
  background-color: #71c1f2;
  padding: 41px 43px 21px 31px;
  height: 100%;
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

@media only screen and (min-width: 1500px) {
  .bg-fundo {
      top: 45%;
  }
  /* .single .case-public .section-title .variant {
      font-size: 50px;
  } */ 
}

@media only screen and (min-width: 1280px) and (max-width: 1499px) {
  .bg-fundo {
      top: 42.5%;
  }
}

@media only screen and (min-width: 1280px) {
  .single .cms-wrapper .t-white h6 img {
      width: 770px;
      object-fit: cover;
      object-position: center;
  }
  .t-white.first-part>div {
      width: 50%;
      height: auto;
  }
  .bg-fundo {
      margin-top: 15rem;
      width: 48%;
      position: absolute;
      height: 100%;
      transform: translateY(-50%);
      right: 0;
  }    
  a.bg-fundo {
      transform: translateY(-125%);
      z-index: 3;
      height: auto;
  }
}

@media only screen and (max-width: 1028px) {
  .bg-fundo {
      display: none;
  }
  .single .case-public {
      margin-bottom: 80px;
      padding: 50px 0;
  }
  .single-cases_publicos .ending-contact {
      padding-top: 20px;
  }
  .itens-blue div 
  .btn-lightBlue {
      margin: auto;
  }

  /* </ Cadastro */

  .cadastro {
      width: 100%;
      margin-left: 0;
      margin-top: 40%;
      margin-bottom: 0;
  }

  .cadastro-itens {
      font-weight: bold;
  }

  .cadastro h1{
      width: 80%;
      margin-left: 10%;
  }

  /* Cadastro >/ */

  /* </ Login */

  .login {
      width: 100%;
      margin-left: 0;
      margin-top: 40%;
      margin-bottom: 0;
  }

  .login-itens {
      font-weight: bold;
  }

  .login h1{
      width: 80%;
      margin-left: 10%;
  }

  /* Login >/ */

  /* </ Recuperar */

  .recuperar {
      width: 100%;
      margin-left: 0;
      margin-top: 40%;
      margin-bottom: 0;
  }

  .recuperar-itens {
      font-weight: bold;
  }

  .recuperar-itens p{
      font-size: 15px;
      margin-bottom: 10px;
  }

  .recuperar h1{
      width: 80%;
      margin-left: 10%;
  }

  /* Recuperar >/ */

  /* </ Redefinir */

  .redefinir {
      width: 100%;
      margin-left: 0;
      margin-top: 40%;
      margin-bottom: 0;
  }

  .redefinir-itens {
      font-weight: bold;
  }

  .redefinir-itens p{
      font-size: 15px;
      margin-bottom: 10px;
  }

  .redefinir h1{
      width: 80%;
      margin-left: 10%;
  }

  /* Redefinir >/ */
}

.section-compliance 
.half-compliance a {
  text-decoration: underline;
}

.case-text {
  margin-bottom: 5rem;
}

h2.section-title.t-white.margin-s.upper {
  width: 51%;
}