@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap');

*{
    font-family: 'Noto Sans', sans-serif;
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    
}




body{
  background-color: #ffffff;
}

/* ----------------------------------------------- */

/*-------------------------------------------MENU----------------------------------------------------*/ 

.header{

   
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: rgb(0, 0, 0);
    transition: 0.3s;
  
}

.exposoft h1{
    color: rgb(255, 255, 255);
    font-size: 30px;
   
    
}



.exposoft{

  margin-left: 60px;
  display: flex;
  text-decoration: none;
 
}

.exposoft:hover{


  text-decoration: none;
 
}


/* ---------------------inicio media query menu ----------------*/


.SobrenosTexto h1{
  color: white;

}

.conteudo-container-sobrenos .TextoSobrenos{
  background-color: #34495E; /* Dark Blue-Gray */
color: white;
}


.imagem {
  position: relative;
  overflow: hidden;
  background-repeat: no repeat;
  background-attachment: fixed;
  background-position: center center;
  background-size: cover;
  max-height: 250px;
}

.imagem img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.texto {
  color: white;
  text-shadow: 3px 3px 3px black;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center; 
}

.texto #maior {
  font-size: 1.8em;
}

.texto #menor {
  text-align: center;
  font-size: 1.3em;
}

/*aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa*/






.container-pag-criadores{

width: 950px;
align-items: center;
margin: auto;
height: 550px;

}

.box-area {
padding: 30px;
position: relative;
display: block;
background-color: #636364;
color: #ffffff;

margin: 40px 0;
width: 900px;
height: 500px;
margin: auto;
margin-top: 50px;
  margin-bottom: 30px;
  border-radius: 3px;
 
}
.box-area h5 {
font-size: 25px;
margin-top: 190px;
margin-bottom: 5px;
letter-spacing: 1px;
color: white;
}
.box-area a{
 
  font-size: 20px;
  text-decoration: none;
  color: inherit;
  color: white;
}

.box-area a:hover{
text-decoration: none;
color: inherit;

}

.box-area .content {
color: #ffffff;
font-size: 18px;
  margin-top: 30px;
  text-align: left;
}

.acessaAIacessaAI{
  background-color: rgb(179, 179, 179);
  border-radius: 15px;
  width: 180px;
  height: 100;
  margin: auto;
  margin-top: 45px;
}

.acessaAIacessaAI:hover{
  background-color: rgb(0, 0, 0);
 color: white;
}
.box-area .img-area {
width: 150px;
height: 150px;
position: absolute;
top: 15px;
left: 0;
bottom: 0;
margin: 0 auto;
right: 0;
z-index: 1;


border: none;
background:none;
  margin-top: 20px;
}
.box-area .img-area i {
font-size: 150px;
}

#testimonial_area .owl-nav {
position: absolute;
top: 50%;
width: 100%;
}
#testimonial_area .owl-prev, #testimonial_area .owl-next {
width: 40px;
height: 40px;
line-height: 40px;
color: #000000;
border-radius: 50%;
text-align: center;
background: #fff;
position: absolute;
}
#testimonial_area .owl-prev {
left: -60px;
top: -30px;
}
#testimonial_area .owl-next {
right: -60px;
top: -30px;
}

.edicoesanteriores p{
  text-decoration: none;
  color: inherit;
 margin-right: 20px;
}


.SobrenosTexto h1{
text-align: center;
}
.TextoSobrenos{
  background-color: rgb(243, 243, 243);
  width: 950px;
  padding: 15px;
  margin: auto;
  border-radius: 7px;
 
}
.TextoSobrenos p{
  font-size: 18px;
}
.conteudo-container-sobrenos{
  width: 920px;
  height: 450px;
  display: flex;
  margin: auto;
  
}


@media (max-width: 1000px) {
 
  .exposoft h1 {
    margin-right: 60px;
  }
 .TextoSobrenos {
      width: auto; /* Auto width for small screens */
      padding: 10px;
  }

  .TextoSobrenos p {
      font-size: 16px; /* Tamanho menor da fonte */
  }

  .box-area .img-area i {
      font-size: 100px; /* Ícone menor para telas pequenas */
  }

  .conteudo-container-sobrenos{
    width: 590px;
  }
}


@media (max-width: 580px) {

  .exposoft h1 {
    font-size: 24px; /* Tamanho menor da fonte para o título */
 
    margin-bottom: 20px;
  }

  .edicoesanteriores{
    text-decoration: none;
    color: inherit;
    margin-bottom: 20px;
  margin-left: 25px;
  }

  .edicoesanteriores:hover{
    text-decoration: none;
    color: inherit;
  }
  
  .header {
    flex-direction: column; /* Stack logo and navigation items vertically */
   margin: auto;
  }

  
  .exposoft h1 {
      font-size: 20px; /* Ainda menor para telas muito pequenas */
  }

  .texto #maior, .texto #menor {
      font-size: 0.9em; /* Tamanho da fonte ajustado para telas muito pequenas */
  }

 .TextoSobrenos p {
      font-size: 14px; /* Tamanho menor da fonte */
  }
  .TextoSobrenos{
    
    width: 450px;
   margin-top: 1px;
  }
 
  .conteudo-container-sobrenos{
    width: 420px;
    margin-left: 40px;
    
  }
}

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

	.container-pag-criadores{
		width: 700px;
		align-items: center;
		margin: auto;
		height: 550px;
		
	}

	.box-area {
		
		width: 690px;
		height: 540px;
		margin: auto;
        margin-top: 20px;
    margin-bottom: 20px;
		
	}

  .img-area i{
    font-size: 30px;
    
  }
	
}
@media only screen and (max-width: 767px) {
	.owl-nav {
		display: none;
	}

    .socials {
        margin-top: 30px;
    }

    

    .img-area i{
      font-size: 1000px;
      
    }
	

	.container-pag-criadores{
		width: 430px;
		align-items: center;
		margin: auto;
		height: 350px;
    margin-bottom: 80px;
		margin-top: 30px;
   margin-left: 30px;
       
	}

	.box-area {
		
		width: 430px;
		height: 440px;
		margin: auto;
    margin-top: 50px;
   
   
    
		
	}

	.box-area .img-area {
		width: 90px;
		height: 90px;
		top: -10px;
        
	}

	.box-area .img-area img {
		width: 90px;
		height: 90px;
		border-radius: 50%;
      
	}

	.box-area h5{
		margin-top: 60px;
		font-size: 25px;

	}

	.box-area .content {
		
		font-size: 17px;
	}
	
}

/*aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa  */

.all-container{

  width: 450px;
  height: auto;
  margin-top: 30px;
  margin: auto;
  text-align: center;
  border-radius: 3px;
  padding-bottom: 15px;
  background-color: #34495E; /* Dark Blue-Gray */
  color: #ECF0F1; /* Light Gray */


}
.sites p{
margin: auto;
font-size: 35px;
width: 520px;
height: 50px;
align-items: center;
text-align: center;
color: rgb(0, 0, 0);
margin-top: 20px;


}

.card-logo-site img{
width: 150px;  
}

.card-logo-site .texto-site{
  width: 400px;
  margin: auto;
  border-radius: 3px;
  padding: 10px;
  color: #ffffff;
  background-color: none;
  font-size: 15px;
  text-align: left;
}


.btn-acessar button{
 
  border-radius: 15px;
  width: 180px;
  height: 100;
  margin: auto;
  background-color: #3498DB; /* Blue */
  border: none;
}


.btn-acessar button:hover{
  color: white;
  background-color: #2980B9; 
}

.titulo-sites{

  margin-top: 100px;
  font-size: 20px;
  color: white;
  padding: 10px;
}

@media only screen and (min-width: 767px) {


.all-container{
 
  width: 620px;
 
}

.titulo-sites{

 
  font-size: 25px;
}
.card-logo-site img{
  width: 200px;  
  margin-top: 20px;
  
  }

  .card-logo-site .texto-site{
    width: 500px;
    margin: auto;
    
    border-radius: 3px;
    padding: 15px;
  }

  .btn-acessar button{
    width: 280px;
    padding: 6px;
    
    
    }

}

@media only screen and (min-width: 1000px) {
 
  .all-container{
 
    width: 920px;
   
  }
  
  .titulo-sites{
  
   
    font-size: 35px;
  }
  .card-logo-site img{
    width: 280px;  
    
    
    }
  
    .card-logo-site .texto-site{
      width: 600px;
      margin: auto;
      
      border-radius: 3px;
      padding: 30px;
    }
  
    .btn-acessar button{
      width: 300px;
      padding: 10px;
      
      
      }
}



.header {
  background-color: white; /* Dark Blue-Gray */
}

.exposoft h1 {
  color: #000000; /* Light Gray */
}

.edicoesanteriores p {
  color: #ECF0F1; /* Light Gray */
}

.texto {
  color: #ECF0F1; /* Light Gray */
  text-shadow: 3px 3px 3px #2C3E50; /* Slightly darker shadow */
}

#maior {
  color: #3498DB; /* Blue */
}

#menor {
  color: #ECF0F1; /* Light Gray */
}



.box-area {
  background-color: #34495E; /* Dark Blue-Gray */
  color: #ECF0F1; /* Light Gray */
}

.acessaAIacessaAI {
  background-color: #3498DB; /* Blue */
}

.acessaAIacessaAI:hover {
  background-color: #2980B9; /* Slightly darker blue on hover */
}

.SobrenosTexto h1 {
  color: #ECF0F1; /* Light Gray */
}

.TextoSobrenos {
  background-color: #636364; /* Gray */
  color: #ECF0F1; /* Light Gray */
}


@media only screen and (max-width: 580px) {
  .box-area .img-area i {
      font-size: 100px; /* Maintain the size for small screens */
  }
  .sites p{
    width: 440px;
  }

}

@media only screen and (max-width: 767px) {
  .box-area .img-area {
      width: 90px;
      height: 90px;
      top: -10px;
  }

  .box-area .img-area img {
      width: 90px;
      height: 90px;
      border-radius: 50%;
  }

  .all-container {
      width: 430px; /* Adjust for small screens */
  }

  .btn-acessar button {
      width: 250px; /* Adjust width for small screens */
  }
}

@media only screen and (min-width: 767px) {
  .all-container {
      width: 620px; /* Adjust for medium screens */
  }

  .card-logo-site img {
      width: 200px; /* Adjust for medium screens */
  }

  .btn-acessar button {
      width: 280px; /* Adjust width for medium screens */
  }
}

@media only screen and (min-width: 1000px) {
  .all-container {
      width: 920px; /* Adjust for large screens */
  }

  .card-logo-site img {
      width: 180px; /* Adjust for large screens */
      height: 180px;
  }

  .btn-acessar button {
      width: 300px; /* Adjust width for large screens */
  }
}


/*------------------------------------------FOOTER-----------------------------------*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400&display=swap'); 



body{
    background-color: #f1f1f1;
}


@import url('https://fonts.googleapis.com/css2?family=Noto+Sans&display=swap');

footer{
    text-align: center;
    background-color: white;
    padding-top: 20px;
    padding-bottom: 2px;
    margin-top: 50px;
}
footer a{
    text-decoration: none;
    color: black;
}
.footer-col{
    margin-bottom: 5%;
}
.expo-title{
    margin-bottom: 10px;
    font-size: 24px;
}
.paginas-title{
    margin-bottom: 10px;
    font-size: 24px;
}
.contato-title{
    margin-bottom: 10px;
    font-size: 24px;
}
.mensagens-title a{
    font-size: 16px;
    line-height: 25px;
    transition: all 0.3s ease
}
.mensagens-title a:hover{  
    color: rgb(0, 87, 226);
    padding-left: 7px;
}
.paginas-buton a{
    font-size: 16px;
    line-height: 25px;
    transition: all 0.3s ease
}
.paginas-buton a:hover{
    color: rgb(0, 87, 226);
    padding-left: 7px;
}
.contato-expo a{
    font-size: 16px;
    line-height: 25px;
    transition: all 0.3s ease;
}
.contato-expo a:hover{
    color: rgb(0, 87, 226);
    padding-left: 7px;
}
.container-imagens-footer{
    width: 150px;
    margin: auto;
    display: flex;
}
.contato-expo i{
    margin-right: 10px;
}

.container-imagens-footer {
  display: flex;
  justify-content: center; /* Alinha os itens ao centro horizontalmente */
  align-items: center; /* Alinha os itens ao centro verticalmente */
  gap: 20px; /* Espaçamento entre as imagens */
}

.Imagem-alcina,
.Imagem-exposoft {
  flex: 1; /* Faz com que ocupem o mesmo espaço dentro do flex container */
  text-align: center; /* Alinha as imagens ao centro */
}