/* Responsividades */

@media only screen and  (orientation: portrait ){
    html, body{
         overflow-x: hidden;
         font-size: 2rem;
    }

    *{
          background-size: 100% 100% !important;
          background-repeat: no-repeat ;
    }

    /* Cabeçalho */
    #navegation_up{
         grid-template-columns: 75% 25%;
         grid-template-rows: 100%;
         border: none;
         gap: none;
         border-bottom: 2px solid;
     }

    #navegation_up>div>a>img{
         width: 45%;
    }


    #botao_sanduiche{
         display: flex;
     }

     #botao_sanduiche:hover{
          scale: 1.2;
     }
     
    #up_link, #up_link_responsivo {
         display: none;
     }

    .up_li_cl_responsivo{
          font-size: 0.6rem;
          position: absolute;
          width: 100% !important;
          height: auto !important;
          display: flex !important;
          justify-content: center!important;
          background-color: #3f09ac;
          overflow-y: hidden;
          z-index: -1;
          opacity: 0;
          animation: barra_navega 0.25s linear forwards;
     }

     @keyframes barra_navega {
          from{
               transform: translateY(-20px);
               opacity: 0;
          }

          to{
               transform: translateY(0px);
               opacity: 1;
          }
     }

    /* conteúdo do meio */

    main>section{
          background-image: url(imagens/fundo_responsivo.png) ;
    }

    #conteudo_meio{
          grid-template-rows:  minmax(40vh, auto);
     }

    #background_img{
          padding: 0;
          margin: 0;
          width: 100%;
          height: 100%;
          display: flex;
          flex-direction: column;
     }

    #inicio_left{
          width: 100%;
          z-index: 99;
          text-align: center;
          margin: 0;
          padding: 0%;
          margin-top: 5%;
     }

    #inicio_left>h1{
          margin-top: 25%;
          font-size: 1.5rem;
     }

     #botao_welcome{
          margin-top: 15%;
          background-color: #3f09ac;
     }

     #botao_welcome:hover{
          scale: 1.1;
     }

     #inicio_right{
          margin-top: 0%;
          width: 100%;
          height: 100%;
          flex-direction: column;
          overflow: hidden;
     }

     #icones{
          display: none;
     }

     #mao{
          width: 90%;
          position: relative;
          right: -15%;
          margin-top: 5%;
          animation: mao_animation 5s infinite linear;
     }

     #about{
          text-align: center;
          height: 100%;
          margin-top: 0;
          padding-top: 6.5%;
     }

     #about>div{
          flex-direction: column;
          justify-content: space-between;
          padding-bottom: 10%;
     }

     #about>div>img{
          width: 75%;
     }

     #solutions_sector{
          height: 100%;
          text-align: center;
          padding-bottom: 20%;
     }

     #solutions_sector ul{
          flex-direction: column;
          flex-wrap: wrap;
          display: grid;
          grid-template-columns: 45% 45%;
          grid-template-rows: 55% 55%;
          gap: 5%;
     }

     #solutions_sector li{
          font-size: 0.4rem;
          width: 100%;
          height: 100%;
          margin-top: 5%;
          transition: scale 0.2s linear;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
     }

     #solutions_sector li:hover{
          transform: translateY(0);
          scale: 1.1;
     }

     #solutions{
          text-align: center;
          background-image: none;
     }

     #solutions>section{
          background-image: url(imagens/fundo_responsivo.png) !important;
     }

     .solutions_section01{
          text-align: center;
          background-image: url(imagens/fundo_responsivo.png) !important;
     }

     .h2_portrait{
          display:block !important;
          font-size: 0.75rem !important;
          width: 80%;
     }

     .sec_portrait{
          display: flex;
          flex-direction: column;
     }

     .sec_portrait>div>h2{
          display: none !important;
     }

     .sec_portrait_reverse{
          display: flex;
          flex-direction: column-reverse;

     }

     .sec_portrait_reverse>div>h2{
          display: none !important;
     }


     .h_p{
          width: 80%;
          padding-bottom: 10%;
          display: flex;
          flex-direction: column;
          align-items: center;
     }

     .h_p>h2{
          font-size: 0.75rem;
     }

     .img_solutions{
          width: 85%;
     }

     .h_p>p{
          margin-top: 10%;
          font-size: 0.55rem;
     }


     #inscricao_form{
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          width: 100%;
     }

     #inscricao_form>h1{
          font-size: 0.5rem ;
          width: 60%;
          text-align: center;
     }

     #inscricao_form>fieldset{
          margin-top: 15%;
          width: 90%;
     }
     
     #inscricao_form>fieldset>*{
          width: 90% !important;
     }

     #termo_uso{
          text-align: center;
     }


     #opcoes_radio{
          width: 50%;
          flex-wrap: wrap;
     }

     #botoes_form{
          justify-content: space-evenly;
          width: 80%;
     }

     .botoes{
          width: 30%;
          font-size: 0.4rem;
          height: 35px;
     }

     #limpar{
          width: 50%;
     }

     /* Estilização do rodapé "footer" */

     #sitemap{
        display: flex;
        flex-direction: column;
     }

     #section_final{
          display: flex;
          flex-direction: column;
     }

     #section_final>a{
          overflow-y: hidden;
          height: 40%;
          margin-bottom: 0;
          padding-bottom: 0;
          display: flex;
          justify-content: center;
          align-items: center;
     }

     #section_final>a>img{
          width: auto;
          height: 100%;
     }

     #section_final>section{
          height: auto;
          width: 80%;
          margin-top: none;
          margin-bottom: 10%;
          overflow-y: hidden;
          display: flex;
          flex-direction: column;
          justify-content: center;
          align-items: center;
          font-size: 0.5rem;
     }

     #direitos_footer{
          grid-row: 2;
     }

     #direitos_footer>p{
          width: 80%;
          text-align: center;
     }

     /* Modal Termos */

     #modal_termos{
          width: 90%;
          height: 60%;
          top: 20%;
          left: 5%;
     }

     #termos_escritos{
          width: 90%;
     }

     #botoes_termos{
          width: 150%;
     }


 }