*{
    margin: 0;
    padding: 0;
    font-family: 'Arial';
    box-sizing: border-box;
}




:root{
    --FonteG: 22px;
    --FonteM: 18px;
    --FonteP: 14px;

    --PaddingG: 30px;
    --PaddingM: 25px;
    --PaddingP: 20px;


    --BodyFundo: #343434;

    --TituloFundo: #343434;
    --TituloTextoCor: white;


    /* A cor Tomato tem o valor RGB (255, 99, 71). */
    --RelogioFundo: rgb(255, 99, 71);
    /* --RelogioFundo: Tomato;  */
    --RelogioTextoCor: white;


    --FormFundo: #C4C4C4;
    
    --FormBotaoFundoCor: black;
    --FormBotaoTextoCor: white;
    --FormBotaoBordaCor: white;
    --FormBotaoFundoCorHover:  white;
    --FormBotaoTextoCorHover: black;
    --FormBotaoBordaCorHover: black;

    --FormOBSFundoCor: #253646;
    --FormOBSTextoCor: red;


    --LarguraMinima: 330px;

}











body {
    /* background-color: rgb(218,177,145); */
    background-color: rgb(229, 202, 141);
    overflow-y: scroll;
}




body.no-scroll {
    overflow-x: hidden;
   /* overflow-y: hidden; */
  
   /* position: fixed;
   width: 100%;
   height: 100%; */
}





.DivFixa{
    background-color: #343434;
    border: 2px solid white;
    /* background-color: rgb(25,42,50); */
    width: 100%;
    position: fixed;
    z-index: 10;
    padding-bottom: 10px;
}











.DivLogoTituloMenu {

    background-color: #343434;;

    position: fixed;
    z-index: 100;

    border: 2px solid white;
    min-width: var(--LarguraMinima);
    
    width: 100%;
    display: flex;
    align-items: center;
    text-align: center;
    padding-right: 5px;
   
}












.LogoL img{
    width: 68px;
    height: 85px;
    display: flex;
}













.DivTitulo {
    width: 100%;
    color: white;
}
.DivTitulo h1 {
    font-size: 30px;
    font-weight: bold;
    line-height: 1.2;
    transition: font-size 0.3s ease-in-out;
}
.DivTitulo h2 {
    font-size: 20px;
    font-weight: bold;
    line-height: 1.2;
    transition: font-size 0.3s ease-in-out;
}
































.MenuGeral{
    display: flex;
}
.MenuTudoMobi {
    display: none;
    padding: 10px;
    z-index: 100;
  }


.NomePessoa {
    color: black;
    background-color: tomato;

    margin: auto;
    /* display: flex; */
   
    border-left: 2px solid white;
    border-right: 2px solid white;
    border-bottom: 2px solid white;

    /* min-width: var(--LarguraMinima) - 100px; */
    max-width: 500px;
    padding-top: 5px;
    padding-bottom: 5px;

    margin-bottom: 10px;
    /* margin-left: 20px; */
    /* margin-right: 20px; */

    text-align: center;

    font-size: 16px;
}



.NomePessoa h3 {
    

   
    margin-left: 10px;
    margin-right: 10px;

}

















/* Container do Hamburger */
.menu-hamburger {
    
    width: 40px; 
    height: 40px; 
    cursor: pointer;
    display: flex; 
    align-items: center; 
    justify-content: center;
    /* z-index: 100; */
    -webkit-tap-highlight-color: transparent;
    
}

/* A barra do meio */
.menu-hamburger .bar {
    width: 100%;
    height: 6px; 
    background-color: tomato;
    border-radius: 2px;
    transition: all 0.3s ease-in-out; 
    position: relative;
}

/* Barras superior e inferior (pseudo-elementos) */
.menu-hamburger .bar::before,
.menu-hamburger .bar::after {
    content: ''; 
    position: absolute; 
    width: 100%;
    height: 6px; 
    background-color:tomato;
    border-radius: 2px;
    transition: all 0.3s ease-in-out; 
    left: 0;
}

.menu-hamburger .bar::before {
    transform: translateY(-15px); 
}

.menu-hamburger .bar::after {
    transform: translateY(15px); 
}

/* --- ESTILOS PARA O ESTADO 'X' (ABERTO) --- */
/* Esta classe será adicionada/removida via JavaScript */
.menu-hamburger.open .bar {
    /* transform: translateX(-50px);  */
    background-color: transparent; 
}

.menu-hamburger.open .bar::before {
    transform: translateY(0) rotate(45deg); 
}

.menu-hamburger.open .bar::after {
    transform: translateY(0) rotate(-45deg); 
}

.MenuGeral.aberto {
    left: calc(100% - 133px);
    /* display: block;  */
    opacity: 100%;
    /* transition: opacity 0.3s ease-in-out; */
}













.DivConteudo {

    /* background-color: rgb(249,235,87); */
     /* background-color: rgb(0,127,255); */
    
    min-width: var(--LarguraMinima);

    /* position: relative; */
    text-align: center;

    /* border: 2px solid red; */

    /* position: relative; */
   
    width: 100%;
   
    /* margin-left: 20px;
    margin-right: 20px; */
    font-size: 26px;
    color: black;
    font-weight: bold;

    padding-left: 20px;
    padding-right: 20px;
    padding-top: 90px;

}
.DivConteudo p{
    padding-top: 16px;
    font-size: 22px;
    color: black;
    font-weight: bold;
}




















.inicio {
    padding-bottom: 20px;
    font-weight: bold;
    /* font-size: 26px; */
    /* line-height: 30px; */
    text-align: center;
}


.LogoInicio{
    text-align : center;   
}
.LogoInicio img{
    width: 240px;
    height: 300px;
    display: inline-block;
}


















.visitante {
    background-color: tomato;
    color: white;
    font-size: 16px;
    min-width: 300px;
    max-width: 600px;
    margin: 0 auto;
    font-weight: bold;
    text-align: center;
    padding: 5px;
}





















.Botoes{
    
    
    transition-property: padding, font-size;
    transition-duration: 300ms;


    background-color: black;
    color: white;
    border: 2px solid white;
    display: inline-block;
    width: 70px;
    /*background-color: wheat;*/
    /*color: black;*/
    font-size: 12px;
    font-weight: bold;
    /*border: 2px solid black;*/
    padding-top: 8px;
    padding-bottom: 8px;
    margin: 5px;
    cursor: pointer;
}
.Botoes:hover{
    transition-property: background-color, color;
    transition-duration: 1000ms;
    background-color: white;
    color: black;
    border: 2px solid black;
    /*    background-color: black;
        color: white;
        border: 2px solid white;*/
}




















.MenuConsulta{
    /*background-color: gray;*/
    min-width: 300px;
    margin: 0px auto;
    /*display: inline-block;*/
    /*align-items: center;*/
    text-align: center;
    /*border: 2px solid black;*/
   
    /* cursor: pointer; */
    /* padding-top: 15px; */
    z-index: 20;
}
.BotoesMenuConsulta{
    transition-property: background-color, color;
    transition-duration: 500ms;
    background-color: tomato;
    color: white;
    border: 2px solid var(--FormBotaoBordaCor);
    display: inline-block;
    width: 150px;
    /*background-color: wheat;*/
    /*color: black;*/
    font-size: 14px;
    font-weight: bold;
    /*border: 2px solid black;*/
    padding: 8px;
    margin-bottom: 10px;
    margin-left: 5px;
    margin-right: 5px;
    cursor: pointer;
}
.BotoesMenuConsulta:hover{
    background-color: var(--FormBotaoFundoCorHover);
    color: var(--FormBotaoTextoCorHover);
    border: 2px solid var(--FormBotaoBordaCorHover);
    /*    background-color: black;
        color: white;
        border: 2px solid white;*/
}


#btnConsultar{
    /* margin-top: 10px; */
    font-size: 14px;
    padding: 5px;
}






















.Conteudo {
    /* border-left: 2px solid white;
    border-right: 2px solid white;
    border-bottom: 2px solid white; */

    min-width: var(--LarguraMinima);

    color: black;
    font-weight: bold;
    /*background-color: red;*/
    /*font-size: 30px;*/
    /*line-height: 30px;*/
    /* position: relative; */
    /* min-width: 300px; */
    /* margin: 0px auto; */
    /* padding-top: 10px; */
    padding-left: 20px;
    padding-right: 20px;
    padding-top: 90px;

    /* padding-top: 50px; */

}




.paragrafo {
    /*background-color: var(--RelogioFundo);*/
    /*color: var(--RelogioTextoCor);*/
    /*min-width: 300px;*/
    padding: 5px;
    margin-bottom: 16px;
    font-size: 20px;
    line-height: 24px;
    text-align: justify;
}





















.FormTudo{
    min-width: 300px;
    max-width: 500px;
    margin: 0px auto;

}

.FormMSG {
      display: none;
    background-color: tomato;
    color: black;
    border: 2px solid black;
    /*border-radius: 15px;*/
    font-size: 16px;
    font-weight: bold;
    text-align: center;
    margin-top: 14px;
    padding: 14px;
}

.Form {
    background-color: var(--FormFundo);
    border: 2px solid black;
    padding: 20px;
    margin-top: 10px;
}

.Form p {
    text-align: center;
    border-top: 2px solid black;
    border-bottom: 2px solid black;
    font-size: 20px;
    font-weight: bold;
    color: black;
    padding-top: 6px;
    padding-bottom: 6px;
}

.FormCampo {
    text-align: left;
    padding-top: 10px;
}

.Form label{
    color: black;
    padding-top: 10px;
    font-size: 16px;
    font-weight: bold;
}

.Form input{
    font-size: 14px;
    padding: 6px;
    width: 100%;
}

.Form select{
    padding: 5px;
    width: 100%;
}

.Form input[type="submit"]{
    background-color: var(--FormBotaoFundoCor);
    color: var(--FormBotaoTextoCor);
    border: 2px solid var(--FormBotaoBordaCor);
    font-size: 16px;
    font-weight: bold;
    padding: 14px;
    cursor: pointer;
}

.Form input[type="submit"]:hover{
    background-color: var(--FormBotaoFundoCorHover);
    color: var(--FormBotaoTextoCorHover);
    border: 2px solid var(--FormBotaoBordaCorHover);
}


#FormOBS{
    background-color: var(--FormOBSFundoCor);
    color: var(--FormOBSTextoCor);
    border: 2px solid var(--FormOBSTextoCor);

    padding: 6px;
    font-size: 12px;
    font-weight: bold;
    margin-top: 10px;
    text-align: center;

}




#curriculo {
    text-align: center;
    margin-bottom: 10px;
}

.links {
    color: red;
    text-decoration: none; /* Remove o sublinhado */
    font-size: 24px;
    font-weight: bold;
    
  
}

















.ParagrafoContato {
    /*background-color: var(--RelogioFundo);*/
    color: black;

    /*min-width: 300px;*/
    padding-top: 5px;
    /* padding-left: 20px; */
    /* padding-right: 20px; */
    /*margin-bottom: 16px;*/

    font-weight: bold;
    font-size: 18px;
    /* line-height: 14px; */
    margin-top: 20px;
    text-align: center;
}


.ParagrafoFone {
    /*background-color: var(--RelogioFundo);*/
    color: black;

    /*min-width: 300px;*/
    padding-top: 5px;
    /*margin-bottom: 16px;*/

    font-weight: bold;
    font-size: 12px;
    line-height: 14px;

    text-align: center;
}


.ParagrafoFone img{
    width: 60px;
    height: 60px;
}























.ServTudo {
    /* padding-top: 20px; */
    text-align: center; 
    color: black;
    font-weight: bold;
    font-size: 22px;
}
.ServTudo p {
      padding-top: 20px;
    /* padding-left: 30px;
     padding-right: 30px; */
}
.ServTudo img{
    padding: 10px;
    width: 550px; 
    height: auto; 
}

















.ServTudoM {
    text-align: center; 
    /* background-color: white; */
    color: black;
    font-weight: bold;
    font-size: 22px;
}


.ServTudoM p {
     padding-top: 50px;
     padding-left: 30px;
     padding-right: 30px;
}



.ServTudoM a {
    text-decoration: none; 
    color: tomato;
    font-weight: bold;
    /*padding: 20px;*/
    cursor: pointer;
}



.ServTudoM img{
    padding: 10px;
    width: 950px; 
    height: auto; 
}



























.SistTudo {
    text-align: center; 
    color: black;
    font-weight: bold;
    font-size: 22px;
}


.SistTudo p {
     padding-top: 10px;
     /* padding-left: 30px; */
     /* padding-right: 30px; */
}



.SistTudo a {
    text-decoration: none; 
    color: tomato;
    font-weight: bold;
    /*padding: 20px;*/
    cursor: pointer;
}


.SistTudo a:hover {
    color: black;
}




















#modalCarregando {
    display: none;
}

.modal {
  width: 100%;
  height: 100%;
  background-color: rgba(40, 40, 40, 0.7);
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1000;
}
.modal-content p {
  color: yellow;
  font-size: 26px;
  font-weight: bold;
  position: absolute;  
  top: 35%; 
  left: 50%;
  transform: translateX(-50%);
}
















.CpefTextes {
    margin: 10px;
    text-align: center;
 }
 .CpefTextes input{
    margin-left: 5px;
    margin-right: 5px;
    padding: 5px;
 }
 
 










@media screen and (max-width:960px) {
    .ServTudoM img{
    width: 750px; 
    }
}







@media screen and (max-width:760px) {
    .ServTudoM img{
    width: 550px; 
    }
}









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



    .DivTitulo h1{
        font-size: 22px;
        line-height: 1.1;
     }
     .DivTitulo h2{
        font-size: 14px;
        line-height: 1.1;
     }






     .MenuGeral{
        position: absolute;
        display: block;  
        top: 90px;
        left: calc(100% + 5px);  
        transition: left 0.3s ease-in-out; 
        z-index: 100;
         
    }
    .MenuTudoMobi {
        display: block;
    }




    /* .Titulo h1 {
        font-size: 24px;
      }
    .Titulo h2 {
        font-size: 14px;
    }
    .Titulo h1, .Titulo h2 {
        transition-property: font-size;
        transition-duration: 0.3s;
        transition-timing-function: ease-in-out;
    }

    .DivFixa h3 {
        font-size: 20px;
        transition-property: font-size;
        transition-duration: 0.3s;
        transition-timing-function: ease-in-out;
    } */
















/* 
    
    .Conteudo {
        padding-left: 30px;
        padding-right: 30px;
    } */






     .Botoes{
        padding: 12px 0;
        /* padding-top: 12px;
        padding-bottom: 12px; */
        width: 120px;
        font-size: 22px;
        /* transition-property: none; */

        transition-property: padding, font-size;
        transition-duration: 300ms;
        /* z-index: 100; */
    }
    
    













    
    
    
    .ServTudo img{
    width: 320px; 
    }

    
    .ServTudoM img{
    width: 320px; 
    }
    











    .ParagrafoContato {
      
        
        font-size: 22px;
       
    }






    
}







