body {
  margin: 0;
  font-family: "Montserrat", sans-serif;
  font-size: 1.2rem;
  font-weight: 400;
  line-height: 25.8px;
  color: #444;
  text-align: left;

}

h1{
	line-height:35px;
	font-size:30px;
}

a { 
 
text-decoration: none;

}

a:visited {
  color:#292929; /* ou a cor desejada */
}

a {
  color: #292929;
  text-decoration: none;
  background-color: transparent;
}

a:hover {
  color:#003399;
  text-decoration: underline;
}

a:not([href]):not([class]) {
  color: inherit;
  text-decoration: none;
}

a:not([href]):not([class]):hover {
  color: inherit;
  text-decoration: none;
}





.link-tb {
color:aliceblue;
text-decoration: none;
	
}




	
		* {
		box-sizing: border-box;
		}
		
		
		.container_p {
		height:100%;  
		margin: 0 auto;
		
		
		}
		
				
		@media (max-width: 768px) {
		.container_p{
		width: 100%;
		}
		}
		


		
		.corpo {
		height:auto;
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		background-color:#FFF;

		}
		
		
		 	@media (max-width: 900px) {
		.corpo {
		width: 100%;
		}
		}

		
		
		.centraliza-bloco{
		
		display: flex;
	display: flex;
		width:100%;
		margin-top:5px;
		flex-wrap: wrap;
        
      
     /** centralizador**/
      align-items: center;
      justify-content: center;
       /** centralizador**/
       padding:3px;

		
}


	@media (max-width: 768px) {
		.centraliza-bloco{
		width: 100%;
		}
		}
		
		@media (max-width: 900px) {
		.centraliza-bloco{
		width: 100%;
		}
		}
		
	

	
		
			.header2 {
			height:90px; 
			margin: 0 auto;	
			margin-top:-5px;		
			color:#292929;
			width:100%;
        	box-shadow: 2px 2px 2px   rgba(12,12,12,0.2);
        	}
        	
			
						
			
			
		
		
		.header1 {
		margin: 0 auto;
		color:black;
		width:100%;
		height:50px;
		background: rgb(63,146,251);
		background: radial-gradient(circle, rgba(63,146,251,1) 6%, rgba(4,43,85,1) 100%);
	    padding:10px 25px 2px 30px;
	    font-family:Arial, Helvetica, sans-serif;
	    font-size:13px;
	    color:aliceblue;
	    box-shadow: 2px 1px 2px 2px rgba(12,12,12,0.2);
	   


		}

		
		
		.header {
		
		
		width:100%;
		height:150px;
		padding:15px;
		margin-top:15px;
		}
		
      


		.div3 {
		
		width:90%;
		height:px;
		margin:15px 5px 15px 15px;
		
		display: flex;
		flex-wrap: wrap;
		
		/** centralizador**/
		align-items: center;
		justify-content: center;
		/** centralizador**/
		
		}
		
		.deskrom {
		width:35%;

		height:700px;
		margin:15px 5px 15px 15px;
		/*box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);	*/
		border:1px #CCC solid;
		border-radius:5px;
		display: flex;
		/**flex-wrap: wrap;
		
		 centralizador 
		align-items: center;
		justify-content: center;
		/** centralizador**/
		
		}
		
		@media (max-width: 800px) {
		.deskrom {
		width: 100%;
		}
		}
		
		
/***************Efeito gerador de Favicons**************************/

		.deskrom-favicon {
		width:23%;
			background-color: #FFf;
			border-radius:5px;
			margin:15px 10px 10px 10px; 
			padding:1px;
			
			height:auto;
			float:left;
			
			flex-wrap: wrap;
			
			/** centralizador**/
			align-items: center;
			justify-content: center;
			
			
			/** centralizador**/
			}
		
		@media (max-width: 900px) {
		.deskrom-favicon {
		width: 100%;
		}

		
		}
		
		
	@media only screen and (max-width: 900px) {
      .deskrom-favicon {
        display: none;
      }
    }
            
    
    
    
    
/********Narrador de texto 30/07/*********/
    #form-deskron{
   
    width:98%; height:auto; padding:10px; margin-top:20px; margin:0 auto;


}

 /********Narrador de texto 30/07/*********/


     .box-upload-favicon{
	

		border:2px #fff solid;
		border-radius:10px; 
		width:80%; 
		height:auto;
		padding:10px;
		background-color:#042B55;
		margin:0 auto;
}


      @media (max-width: 900px) {
		.box-upload-favicon {
		width: 100%;
		}

		
		}

		

		
	

/***************Fim Efeito gerador de Favicons**************************/

		
/************* Efeito redimenciona image inicio ********************/
		.deskrom-redimenciona {
		width:23%;

		height:auto;
		margin:15px 2px 15px 15px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);	
		/*border:1px #CCC solid;*/
		border-radius:5px;
		display: flex;
		/**flex-wrap: wrap;
		
		 centralizador 
		align-items: center;
		justify-content: center;
		/** centralizador**/
		
		}
		
						
		@media only screen and (max-width: 900px) {
		.deskrom-redimenciona {
		display: none;
		}
		}


/**********Efeito redimenciona image fim***********************/	
	
	.deskrom_contato {
		width:100%;
		height:520px;
		margin:5px 5px 30px 15px;
		display: flex;
		margin:0 auto;
		/*flex-wrap: wrap;*/
		}
		
		@media (max-width: 900px) {
		.deskrom_contato{
		width: 100%;
		}
		}

	/************Deskrom codigo de barras**************/
	
	.deskrom-CR{
		width:50%;
		height:auto;
		margin:15px 5px 15px 15px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);	
		border-radius:5px;
			
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
	
		
		}
		
		
		@media (max-width: 900px) {
		.deskrom-CR {
		width: 100%;
		}
		}

	
	
	/**************************/
	
	
	/***input  volume e speed page narrador de teste****/
	
	#ranger-narrador{
	
	/*border:1px #ccc solid; border-radius:25px; height:40px; width:250px; padding:5px;background: rgb(204,204,204);
	background: linear-gradient(279deg, rgba(204,204,204,1) 0%, rgba(225,225,225,1) 10%, rgba(233,233,233,1) 85%, rgba(204,204,204,1) 100%);*/
	align-items: center;
	justify-content: center;
	display: flex;
	flex-wrap: wrap;
	


	
    }
	
		
	
	
		.inputFile {
		position: relative;
		display: inline-block;
		cursor: pointer;
		height: 1.5rem;
		}
		
		.inputFile input {
		margin: 0;
		filter: alpha(opacity=0);
		opacity: 0;
		}
		
		.inputFile-custom {
		text-align: left;
		position: absolute;
		top: 0;
		right: 0;
		left: 0;
		z-index: 5;
		height: 2.8rem;
		width:350px;
		padding: .5rem 1rem;
		line-height: 1.5;
		color: #444;
		background-color: #f1f1f1;
		border: px solid #ddd;
		border-radius: 3px;
		box-shadow: inset 0 .5px .5px rgba(0, 0, 0, .05);
		user-select: none;
		}
		
		.inputFile-custom:before {
		position: absolute;
		top: 1px;
		right: -1px;
		bottom: -1px;
		z-index: 6;
		display: block;
		content: "Procurar";
		height: 1.5rem;
		padding: .5rem 1rem;
		line-height: 1.5;
		color: #f1f1f1;
		background-color: #042B55;
		border: 1px solid;
		border-radius: 0 3px 3px 0;
		}
		
		.inputFile-custom:after {
		content: "Selecionar Imagem...";
		}

	
	
	/********/


   
    .div4 {
		background-color: #FFEB3B;
		border: 1px solid black;
		margin-left:15px;
		margin:15px 15px 15px 15px;
		width:500px;
		height:500px;
		float:left;
    }
    
     /***efeito contador de palavras**/
        .ecorom-contp {
        width:60%;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
		border-radius:5px;
		margin:15px 15px 15px 15px;
		padding:5px;
		height:auto;
		margin-right: auto; margin-left: auto;  flex-wrap: wrap; display: flex;
		
		 
		 
		
	}
	
	.contador-campo{
	
    width:100%; height:auto; color:aliceblue; text-align:center; color:#292929;
	
	
	
}
		
		textarea {
		width:100%;
		height:400px;
		margin-bottom: 10px;
		transition: box-shadow 0.8s ease-in-out;
		outline: none;
		}
		
		textarea:hover {
		box-shadow: 1px 1px 9px 4px rgba(100, 149, 237, 1);
		-webkit-box-shadow: 1px 1px 9px 4px rgba(100, 149, 237, 1);
         -moz-box-shadow: 1px 1px 9px 4px rgba(100, 149, 237, 1);
		}
		
		textarea:focus {
        border: 2px solid #042B55;}
        
         .result {
            margin-bottom: 10px;
        }

		 /***efeito contador de palavras fim**/ 

    
    
    /****Efeito narrador*****/
    
    
    .ecorom-narrador {
        width:60%;
		background-color: #FFf;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);

		border-radius:5px;
		margin:15px 15px 15px 15px;
		padding:5px;
		height:auto;
		
		text-align:center;
		flex-wrap: wrap;
		
		/** centralizador**/
		align-items: center;
	    justify-content: center;
	
	}
    
      	@media (max-width: 768px) {
		.ecorom-narrador{
		width: 100%;
		}
		}
		

    
    
    
    
     
    /*****inio nem page teste*****/
    
        .div-container{
        height:auto;
		display:flex;
		justify-content: center;
		margin:0 auto;
		
		
}
      	@media (max-width: 900px) {
		.div-container {
		width: 100%;
		}
		}
		


    /*----------------------------------------------------------------*/
    	
		.div-center {
		width:50%;
		height:auto;
		margin:0 auto;
		margin-top:15px;
		margin-bottom:15px;
		padding:5px 5px 25px 5px;
		float:left;
		border-radius:15px;
		text-align: center;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		/*border: 1px solid #ccc;
		border-radius: 10px;
		box-shadow: 2px 2px 12px rgba(0,0,0,0.1);*/

	
		
		
		}
		
		@media (max-width: 900px) {
		.div-center {
		width:98%;
		}
		}
		
		/*----------------------------------------------------------------*/
		
		
		
		/*esquerda*/
		.div-left {
		 width:20%;
		/*	background-color: #FF6600;
			box-shadow: 2px 3px 2px 2px rgba(12,12,12,0.2);
			border-radius:5px;*/
			margin:15px 10px 10px 10px; 
			padding:1px;
			
			height:100%;
			float:left;
			
			flex-wrap: wrap;
			
			/** centralizador**/
			align-items: center;
			justify-content: center;
			
			
			/** centralizador**/
			}
		
	
		
		@media only screen and (max-width: 900px) {
	      .div-left {
	        display: none;
	      }
	    }
            
    /*----------------------------------------------------------------*/
		
		
		.div-right {
		width:20%;
		/*background-color:#0066FF;
		box-shadow: 2px 3px 2px 2px rgba(12,12,12,0.2);
		border-radius:5px;*/
		margin:15px 10px 10px 10px; 
		padding:1px;
		
		height:100%;
		float:left;
		
		flex-wrap: wrap;
		
		/** centralizador**/
		align-items: center;
		justify-content: center;
		
		
		/** centralizador**/
		
		
		}
		
		
				
		
		@media only screen and (max-width: 900px) {
		.div-right {
		display: none;
		}
		}

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


.div-feedback{

   width:98%;
   height:auto; 
   background-color:#FFFFFF; 
   margin:auto; 
   margin-top:1px; 
   padding:20px 0px 20px 0px; 
   text-align:center; 
   line-height:20px;
   font-size:15px;

	
}




		.div-rodape {
		
		display: flex;
		flex-wrap: wrap;
		width:100%;
		margin-top:20px;
		align-items: center;
		justify-content: center;
		padding:20px;
		 background-color:#042B55;
		height:auto; 
		padding:10px 10px 10px 25px;

	
}



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


/*************Mini Bloq interno ************************/
         .div-bg{
          width:60%; 
          height:auto; 
          background-color:#FFFFFF;
          margin: 10px; 
          /*border-radius: 5px;
          box-shadow: 1px 2px 2px 2px rgba(12,12,12,0.2); */
          padding:20px; 
          line-height:35px; 
          margin-right: auto; 
          margin-left: auto;  
          flex-wrap: wrap; 
          display: flex;
          font-size:18px;
		  font-family:Arial, Helvetica, sans-serif;
		 

	
}

		@media (max-width: 900px) {
		.div-bg{
		width:98%;
		}
		}
		
		
		.div-bg-s{
          width:60%; 
          height:auto; 
          background-color:#FFFFFF;
          margin: 10px; 
          /*border-radius: 5px;
          box-shadow: 1px 2px 2px 2px rgba(12,12,12,0.2); */
          padding:20px; 
          line-height:35px; 
          margin-right: auto; 
          margin-left: auto;  
          font-size:18px;
		  font-family:Arial, Helvetica, sans-serif;
		 

	
}

		@media (max-width: 900px) {
		.div-bg-s{
		width:98%;
		}
		}

		
		
		  .div-bg-n{
			width:80%; 
			height:100%; 
			background-color:#FFFFFF;
			margin: 10px; 
			border-radius: 5px;
		/*	box-shadow: 1px 2px 2px 2px rgba(12,12,12,0.2); */
			padding:20px; 
			line-height:35px;
			margin-right: auto; 
			margin-left: auto;
			flex-wrap: wrap;  
			display: flex;

			justify-content: center;

          
	
}

		@media (max-width: 900px) {
		.div-bg-n{
		width:98%;
		}
		}
		




		
		
		
/****************fim teste nem page********************************************/

    
    
    
    
    
    
    
    
    
  /****Efeito redimenciona imagens*****/
    
    
    .ecorom-Redimensionador {
        top: 0;
        width:50%;
		background-color: #fff;
		box-shadow: 2px 3px 4px 2px rgba(12,12,12,0.2);
		border-radius:5px;
		margin:15px 15px 15px 10px;
		padding:5px;
		height:auto;
		
		text-align:center;
		flex-wrap: wrap;
		
		/** centralizador**/
		align-items: center;
	    justify-content: center;
	
	}
    
      	@media (max-width: 800px) {
		.ecorom-Redimensionador{
		width: 100%;
		}
		}
		

    
    
    
    /*****fim Efeito redimenciona imagens*****/

    
    
    
    
        .ecorom {
        width:50%;
		background-color: #FFF;
		box-shadow: 2px 3px 4px 2px rgba(12,12,12,0.2);
		/*border:1px #CCC solid;*/
		border-radius:5px;
		margin:15px 5px 15px 10px;
		padding:5px;
		height:auto;
		float:left;
		display: flex;
		flex-wrap: wrap;
		/** centralizador**/
		align-items: center;
	    justify-content: center;

		/** centralizador**/
		
		
    }
    
    	@media (max-width: 900px) {
		.ecorom {
		width: 100%;
		}
		}
		
		
		.ecorom_2 {
        width:40%;
		background-color: #FFF;
		box-shadow: 2px 3px 4px 2px rgba(12,12,12,0.2);
		/*border:1px #CCC solid;*/
		border-radius:5px;
		margin:15px 5px 15px 10px;
		padding:5px;
		height:auto;
		float:left;
		display: flex;
		flex-wrap: wrap;
		/** centralizador**/
		align-items: center;
	    justify-content: center;

		/** centralizador**/
		
		
    }
    
    	@media (max-width: 900px) {
		.ecorom {
		width: 100%;
		}
		}
		
		/**teste **/
		.div-right_inpage {
		
		width: 30%;
		height: auto; /* Melhor usar auto para evitar problemas */
		padding: 5px;
		display: flex;
		
		text-align: center;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		
		
		box-shadow: 2px 3px 2px 2px rgba(12, 12, 12, 0.2);
		margin: 10px;
		border-radius: 5px;

}
			
	@media (max-width: 900px) {


    .div-right_inpage {
        width:98%; /* Ocupa quase toda a largura no mobile */
    }
}			

/**teste **/

		
/************************************************************/

        .ecorom_contato {
        width:50%;
		background-color: #FFF;
		
		border-radius:5px;
		margin:15px 15px 15px 15px;
		padding:5px;
		height:auto;
		float:left;
		display: flex;
		flex-wrap: wrap;
		/** centralizador**/
		align-items: center;
	    justify-content: center;

		/** centralizador**/
		
		
    }
    
    	@media (max-width: 900px) {
		.ecorom_contato {
		width: 100%;
		}
		}
		



/************************************************************/		
			.ecorom-cr {
			width:23%;
			background-color: #FFf;
			margin:15px 10px 10px 10px; 
			padding:1px;
			
			height:auto;
			float:left;
			
			flex-wrap: wrap;
			
			/** centralizador**/
			align-items: center;
			
			
			
			/** centralizador**/
		
		
		}
		
				
		
	@media only screen and (max-width: 900px) {
      .ecorom-cr {
        display: none;
      }
    }

		
		



/***********************redirecionamento de imagens*************************************/		
		    .ecorom-red {
			width:23%;
			background-color: #FFf;
			box-shadow: 2px 3px 2px 2px rgba(12,12,12,0.2);
			border-radius:5px;
			margin:15px 10px 10px 10px; 
			padding:1px;
			
			height:auto;
			float:left;
			
			flex-wrap: wrap;
			
			/** centralizador**/
			align-items: center;
			justify-content: center;
			
			
			/** centralizador**/
		
		
		}
		
		@media (max-width: 900px) {
		.ecorom-red {
		width: 100%;
		}

		
		}
		
		
	@media only screen and (max-width: 820px) {
      .ecorom-red {
        display: none;
      }
    }

		
		
/****************************************/

		
		
		.printimg{
      border:2px #ccc dashed;
      max-width:250px;
      max-height:250px;
     

     

    }
    
    .ecoimg{
    
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;

	
}


  #div-eco-img{
	top: 0;
	left: 0;
	width: 80%;
	max-width: 100%;
	max-height: 100%;
	padding:20px 10px 10px 10px;
	border:3px #042B55 dashed;
	height:200px;
	border-radius:10px; 
	margin-top: 0px;
	display:inline-block; 
	
	object-fit: contain;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	
	
	 
 

	
}

/* Estilo para as imagens com cantos arredondados */
.rounded-image {
  border-radius: 10px;
}


		

    .Rodape1 {
    
		width: 100%;
		height:150px;
		margin-top:5px;
		padding:20px 20px 10px 20px;
		background-color:#292929;
		display: block;
		min-height: 100px;
		bottom:0;
		left:0;
		color:#FFFFFF;    
      
    }

    @media (max-width: 768px) {
      .div2, .div3, .div4 {
        width: 100%;
      }
    }
    

    
        .box_menu_bg {
		width:80px;
		height: 60px;
		text-align:center;
		float:right;
		margin-top:15px;
			}

    
    
    
    
    
    	.box_logo {
		width: 150px;
		height: 60px;
		background-color:#FFFFFF;
		
		text-align:center;
		float:left;
		margin-top:15px;
			}
		
		.m-0 {
		margin: 0 ;
		font-family: 'good-times-regular', sans-serif;
		font-size:30px;
		}
		.text-uppercase {
		text-transform: capitalize; 
		}
		.text-primary {
		color: #FFCC00;
		 text-decoration: none;
		
		}
		.text-white {
         color: #999 ;
		}
		.font-weight-normal {
		  font-weight: 400 !important;
		}
		.text-segundo {
		  color:#999;
		    text-decoration: none;
		    font-family:
		}
		


		.img-adp{
		margin:0 auto;
		height:100%;
		margin-left:20px;
		
		
		}
		
		
/*************/
	#menuContainer{
	color:aliceblue;
	
	
}	

@media (max-width: 600px) {
		#menuContainer {
		width: 100%;
		}
		}

		
		

/***box ****/


		@media (max-width: 600px) {
		.box {
		width: 100%;
		}
		}
		
		.box {
		width: 180px;
		height: 180px;
		background-color:#FFFFFF;
		margin:5px;
		border-radius:10px;
		box-shadow: 2px 2px 2px 2px rgba(12,12,12,0.1);
		padding:20px;
		text-align:center;
        border:2px solid transparent;
        background: linear-gradient(white, white) padding-box, linear-gradient(to right, #347deb, #347deb) border-box;
        font-family: 'IBM Plex Sans', sans-serif;
        font-weight:200;
        font-size:15px; 
        line-height:normal;       
		}
		
				

		
		
		
		
		
		
/***box_FM ****/
						
		
		.box-fm {
		width:100%;
		height:auto;
		background-color:#FFFFFF;
		/*margin: 10px;*/
		/*margin-top:15px;*/
		/*border-radius: 1px;*/
		/*box-shadow: 2px 2px 2px 2px rgba(12,12,12,0.2);*/
		padding:10px;
		text-align:center;
        border-top: 1px solid #ccc;
        /*background: linear-gradient(white, white) padding-box, linear-gradient(to right, #347deb, #0c13e8) border-box;*/
		
	

		
		
		}
		
		
		
		/***box_FM ****/
		
		 .box-text{
    
		width: 100%;
		height:auto;
		background-color:#FFFFFF;
		margin: 10px;
		border-radius: 2px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
		padding:20px 20px 20px 50px;
		text-align:left;
		
	
}






    .container-heard{
      display: flex;
      flex-wrap: wrap;
      width:100%;
      margin-top:20px;
      
      
     /** centralizador**/
      align-items: center;
      justify-content: center;
       /** centralizador**/
       padding:20px;

	
}
      .container-heard-rodape{
      display: flex;
      flex-wrap: wrap;
      width:100%;
      margin-top:20px;
      align-items: center;
      justify-content: center;
      padding:10px 10px 10px 25px;
      background-color:#042B55;
      height:auto;

	
}






    .box-text-index{
    
		width:100%;
		/*background: rgb(63,146,251);
        background: radial-gradient(circle, rgba(63,146,251,1) 6%, rgba(4,43,85,1) 100%);	*/	
        /*margin: 5px;*/
		/*border-radius: 5px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);*/
		padding:10px;
		text-align:center;
		color:#292929;
		font-family: 'Poppins', sans-serif;
        font-weight:300;
		font-Size:70px;
		line-height:60px;
		
	
}


.animated-text {
    animation: colorChange 10s infinite;
    
}

@keyframes colorChange {
    0% {
        color: #ff0000; /* Primeira cor */
    }
    33% {
        color: #0099ff; /* Segunda cor */
    }
    66% {
        color: #d400ff; /* Terceira cor */
    }
    100% {
        color: #ff0000; /* Retorna à primeira cor */
    }
}


.box-text-index p {
    margin-top:15px; /* Espaçamento acima de cada parágrafo */
    margin-bottom: 15px; /* Espaçamento abaixo de cada parágrafo */
}

/* Estilos específicos para dispositivos móveis */
@media (max-width: 900px) {
    .box-text-index {
        font-size: 40px; /* Reduz o tamanho da fonte */
        line-height:40px; /* Ajusta o espaçamento entre linhas */
        padding: 1px; /* Aumenta o padding */
    }

    .box-text-index p {
        margin-top: 10px;
        margin-bottom: 10px;
    }
}

/*********Efeito convert image********************/

    #drag-and-drop {
    
     
      flex-direction: column;
      justify-content: center;
      align-items: center;
      border: 2px dashed #fff;
      border-radius: 5px;
      padding:25px 10px 10px 10px;
      text-align: center;
      font-family: Arial, sans-serif;
      color: #fff;
      cursor: pointer; 
      font-size:15px; 
      height:120px; 
      width:100%; 
      
        }

    #drag-and-drop.hover {
      border-color: blue;
      color: #333;
    }

    #file-list {
      list-style: none;
      padding: 0;
          }

.box-inpult{
		height:auto;
		width:98%;
		padding:10px;
		background-color:#042B55;
		background-image:url('img/pattern-convert-webp.png');
		 display: flex;
      justify-content: center;
      align-items: center;	
      border-radius:5px;
}




/************Efeito convert image******************/



/*********************************************************/

    .box-ads-top{
    
		width: 80%;		
		margin: 5px;
		border-radius: 5px;
	/*	box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);*/
		padding:5px;
		text-align:center;
		height:100px;
		display:flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto;
		margin-top:15px;
	
		
}


 /* Estilo para dispositivos móveis */
    @media only screen and (max-width: 800px) {
      .box-ads-top {
        display: none;
      }
    }

/**************************************************/


/*********************************************************/

    .box-ads-top-cel{
    
        display: none;
		width:330px;
		height:70px;		
		margin: 5px;
		border-radius: 5px;
	/*	box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);*/
		padding:5px;
		text-align:center;
		
		
		align-items: center;
		justify-content: center;
		margin: 0 auto;
		margin-top:15px;
		
}


 @media (max-width: 800px) {
      .box-ads-top-cel {
        display: block; /* Tornar a div visível em dispositivos com largura máxima de 800 pixels */
        /* Adicione outros estilos aqui, se necessário */
      }
    }
/**************************************************/






    .box-text_2{
    
		width: 100%;
		
	
		margin: 5px;
		border-radius: 5px;
		 /*box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);*/
		padding:10px;
		text-align:center;
		line-height:30px;
		color:aliceblue;
		margin-bottom:20px;
		font-weight:600;
		
	
}


    .box-bto{
    
		width: 200px;
		height:auto;
		background-color:#FFFFFF;
		margin:3px;
		border-radius: 5px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
		padding:10px;
	    
        text-align: center;
       
		 display: inline-block;

       
		 
	
}


    .box-retangular{
    
		width: 300px;
		height: 250px;
		background-color:#FFFFFF;
		margin: 10px;
		border-radius: 5px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
		padding:20px;
		text-align:center;
	
}

    .box-retangular-rodape{
    
		width: 300px;
		height: 250px;
		margin: 10px;
		border-radius: 5px;
		padding:20px;
		text-align:center;
		color:aliceblue;
	
}




box-retangular-rodape

/***grupo formulario**/


    .form-control{
	border:1px #042B55 solid ;
	height:40px;
	padding:10px;
	width:450px;
    box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
    display: flex;
    
    
	
}

@media (max-width: 600px) {
		.form-control{
		width: 100%;
		}
		}


.bt-envia{
	height:40px; width:120px; background-color:#042B55; color:aliceblue; font-size:15px;  border: none;  cursor:pointer; font-weight: bold;
}


#code-box{
	width:100%; border:1px #ccc solid; border-radius:5px; line-height:30px; color:black; font-size:18px; color: black;
	background: none;
	text-shadow: 0 1px white;
	font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace; padding:10px;background-color:#f2f2f2; text-align-last:center;
}



/****botões****/

.button-standard{
border:2px #042B55 solid; border-radius:5px; font-size:17px; background-color:#042B55; color:aliceblue; width: 80px; height: 40px; cursor:pointer;
	
}

.button-houve{
border:3px #FF0000 solid; border-radius:15px; font-size:17px; background-color:#FF5E62; color:aliceblue; width: 120px; height: 40px; margin-top:20px; cursor:pointer;
	
}


.button-houve:hover {
  background-color: crimson;
}


.button-standard:hover{
background-color:dodgerblue;

	
}

.link_destak{
	color:#292929;
}

.link_destak:hover{
color: #042B55; 
text-decoration: underline; 	
}


/*****************WEB BLOG******************************************************************************************/


						
		
		.box-wb {
		width:100%;
		height:auto;
		background-color:#FFFFFF;
		/*margin: 10px;*/
		/*margin-top:15px;*/
		/*border-radius: 1px;*/
		/*box-shadow: 2px 2px 2px 2px rgba(12,12,12,0.2);*/
		padding:10px;
		text-align:center;
        border-top: 1px solid #ccc;
        border-bottom:1px #ccc solid; 
        /*background: linear-gradient(white, white) padding-box, linear-gradient(to right, #347deb, #0c13e8) border-box;*/
		font-size:16px;
		color:#042B55;
		}
		
.box-wb a {
  color:black; /* Cor do link dentro da classe .box-wb */
}
	

		.box-wb2 {
		margin-top:15px;
		width:100%;
		height:150px;
		background-color:#efefef;
		/*margin: 10px;*/
		/*margin-top:15px;*/
		/*border-radius: 1px;*/
		/*box-shadow: 2px 2px 2px 2px rgba(12,12,12,0.2);*/
		padding:10px;
		text-align:center;
        border-top: 1px solid #ccc;
        border-bottom:1px #ccc solid; 
        /*background: linear-gradient(white, white) padding-box, linear-gradient(to right, #347deb, #0c13e8) border-box;*/
		font-size:16px;
		color:#042B55;
		margin-bottom:15px;
		display: flex;
        display: grid;
        place-items: center;		
		
		}
		
.box-wb2 a {
  color:#042B55; !important /* Cor do link dentro da classe .box-wb */
}
		
	
		
		/***web Blog ****/
		
		
	.logo-mobile {
		font-size: 30px
		
	}
	
				
		.box-grade-cont {
		width:350px;
		height: 500px;
		background-color:#FFFFFF;
		margin:0 auto;
		margin-bottom:20px;
		margin-left:15px;
		border-radius: 5px;
		box-shadow: 2px 2px 2px 2px rgba(12,12,12,0.2);
		padding:10px;
	
        border: 3px solid transparent;
        background: linear-gradient(white, white) padding-box, linear-gradient(to right, #347deb, #347deb) border-box;
		}
		
		@media (max-width: 900px) {
		.box-grade-cont {
		width: 100%;
		}
		}


	
	



/*-------------------inicio efeito pagina sorteio online----------------------------------------------*/

    .box-retangular-so{
    
		width: 300px;
		background-color:#FFFFFF;
		margin: 10px;
		border-radius: 5px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
		padding:20px;
		text-align:center;
		display: inline-block;  
		vertical-align: top; 
		height:380px;
	
}

.box-retangular-so:hover {
    background-color: #FFA500; /* Laranja */
    color: #fff; /* deixa o texto branco para contraste */
    cursor: pointer; /* mostra a mãozinha */
    transition: background-color 0.3s ease, color 0.3s ease;
}

    .box-retangular-son{
    
		width:90%;
		min-height:420px;
		margin: 10px;
		border-radius: 5px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
		padding:20px 10px 20px 10px;
		text-align:center;
		margin:0 auto;
		
		
		
		}
		
		/*vertical-align: top; */
		@media (max-width: 900px) {
		.box-retangular-son {
		width: 95%;
		}
		}
		
		
		
	 .box-retangular-so-nomes{
    
		width:90%;
		min-height:920px;
		margin: 10px;
		border-radius: 20px;
		box-shadow: 1px 2px 3px 2px rgba(12,12,12,0.2);
		padding:20px 10px 20px 10px;
		text-align:center;
		margin:0 auto;
		}
		
		/*vertical-align: top; */
		@media (max-width: 900px) {
		.box-retangular-so-nomes {
		width: 95%;
		}
		}
		
		#transparente-center{
        background-color: rgba(12, 20, 66, 0.9); 
        background-image:url('sorteio-online/cont.bg.jpg');
	
}
		
	/*	
 #transparente-center{
background-color: rgba(100, 149, 237, 0.6);} */

#userInput{

border-radius:10px;
border:5px #FF6600 solid;
padding:15px;
font-size:18px;
color:#CCCCCC;
background-image:url('sorteio-online/cont.bg.jpg');
  background-color: rgba(12, 20, 33, 0.9); 
  background-repeat:no-repeat;
  background-size:cover; 

}







	



		
	


#numOfNumbers {
	height:60px;
	width:15em;
	text-align:center;
	border:2px #042B55 solid;
	border-radius:5px;
	font-size:20px;
	font-family:"Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
	color:#333333;
	padding:5px 5px 5px 10px;
}

#bto-sot{
	
}

#sorteioName{
	

    min-height:40px;
	width:100%;
	border:2px #042B55 solid;
	border-radius:5px;
	font-size:15px;
	font-family:"Lucida Sans", "Lucida Sans Regular", "Lucida Grande", "Lucida Sans Unicode", Geneva, Verdana, sans-serif;
	color:#333333;
	padding:15px;
	
}

@media (max-width: 900px) {
		.sorteioName {
		width: 90%;
		}
		}
		




/*-------------------inicio efeito pagina sorteio----------------------------------------------*/

		
		
		.div-coluna-bg {
		width:40%;
		border-radius:5px;
		margin: 0 auto;
		/*margin:15px 10px 10px 10px; 
		padding:5px 25px 5px 25px;
		height:98%;
		display: inline-block;  
		/** centralizador**/
		align-items: center;
		justify-content: center;
		/** centralizador**/
		font-size:18px;
		font-family:Arial, Helvetica, sans-serif;
		 
		
		
		}
		
		@media (max-width: 900px) {
		.div-coluna-bg {
		width:98%;
		}
		}
		
		
		/**********************************************/
		
		
		.div-coluna-bg-2 {
		width:60%;
		border-radius:5px;
		margin: 0 auto;
		/*margin:15px 10px 10px 10px; 
		padding:5px 25px 5px 25px;
		height:98%;
		display: inline-block;  
		/** centralizador**/
		align-items: center;
		justify-content: center;
		/** centralizador**/
		font-size:18px;
		font-family:Arial, Helvetica, sans-serif;
		 
		
		
		}
		
		@media (max-width: 900px) {
		.div-coluna-bg {
		width:98%;
		}
		}

		
		/*---------------------------*/
		
		.div-feedback-2{

   width:60%; height:auto; background-color:#FFFFFF; margin:auto; margin-top:10px; border-radius: 5px;  padding:20px 0px 20px 0px; text-align:center; line-height:25px;

	
}

/** letras bonitas **/

  #div-letras{
	top: 0;
	left: 0;
	width: 90%;
	max-width: 100%;
	max-height: 100%;
	padding:20px 10px 10px 10px;
	
	height:100%;
	border-radius:10px; 
	margin-top: 0px;
	display:inline-block; 	
	object-fit: contain;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	

	
}

    #div-campo-letras{
   
    width:98%; height:100%; padding:10px; margin-top:20px; margin:0 auto;z-index:9999;


}

.box-l{
	min-height:60px; width:90%; border:1px #999 solid; border-radius:5px; margin:0 auto; margin-bottom:15px; text-align:left; padding:5px; display:flex;
}

        .center-l {
		width:50%;
		/*background-color: brown;*/
		box-shadow: 2px 3px 4px 2px rgba(12,12,12,0.2);
		border-radius:5px;
		margin:15px 5px 15px 10px;
		padding:5px;
		height:100%;
		float:left;
		text-align: center;
		flex-wrap: wrap;
		align-items: center;
		justify-content: center;
		
		
		
    }
    
    	@media (max-width: 900px) {
		.center-l{
		width: 100%;
		}
		}
		
.bto-l{
border:2px aliceblue solid; display:flex; border-radius:5px;  background-color:; color:aliceblue;  font-size:12px; text-align:center; padding:10px; cursor:pointer; float:right;
		
	
}

.bto-letras{
	 height:40px; width:80px;   center; margin-left: auto; margin-top:-10px;
	  
}


     .text-letras{
	

		border:2px #fff solid;
		border-radius:5px; 
		width:100%; 
		height:auto;
		padding:10px;
		background: rgb(5,169,217);
        background: linear-gradient(3deg, rgba(5,169,217,1) 0%, rgba(45,67,253,1) 87%);		
        margin:0 auto;
		color:#fff;
}


      @media (max-width: 900px) {
		.text-letras{
		width: 100%;
		}

		
		}
		
		  .div-bg-l{
          width:60%; 
          height:auto; 
          background-color:#FFFFFF;
          margin: 10px; 
          border-radius: 5px;

          padding:20px; 
          line-height:35px; 
          margin-right: auto; 
          margin-left: auto;  
          flex-wrap: wrap; 
          display: flex;
	
}

		@media (max-width: 900px) {
		.div-bg-l{
		width:98%;
		}
		}


/***********meu ip******************/

 .tabela-ip{
    
		width:250px;
		height:40px;
		background-color:#FFFFFF;
		margin: 5px;
		border-radius: 2px;
  		padding:10px;
		text-align:left;
		 display: inline-block;
		 font-size:10px;
		 vertical-align: top; /* Alinhamento vertical superior */
		 		color:#0066CC;
	
}


 .tabela-ip2{
    
		width:250px;
		height:50px;
		background-color:#FFFFFF;
		margin: 5px;
		border-radius: 5px;

	
		padding:10px;
		text-align:left;
		 display: inline-block;
		 font-size:17px;
		 vertical-align: top; /* Alinhamento vertical superior */
		 font-weight:bold;
		 font-family:Cambria, Cochin, Georgia, Times, "Times New Roman", serif;
	
}

 .tabela-geo{
    
		background-color:#FFFFFF;
		margin: 5px;
		padding:10px;
		text-align:center;
		 display: inline-block;
		 font-size:20px;
		 vertical-align: top; /* Alinhamento vertical superior */
	
}


/*************menu lateral*********************/


		   .image-button {
            border: none;
            background: none;
            cursor: pointer;
        }
        .image-button img {
            width: 50px;
            transition: transform 0.2s ease;
        }
        .image-button:active img {
            transform: scale(0.95);
        }
        .sidebar {
            position: fixed;
            top: 0;
            left: -230px;
            width: 230px;
            height: 100%;
            background: rgb(4,43,85);
            background: linear-gradient(0deg, rgba(4,43,85,1) 0%, rgba(10,63,197,1) 100%);
            
            color: white;
            padding: 20px;
            box-shadow: 2px 0 5px rgba(0,0,0,0.5);
            transition: left 0.3s ease;
            border-radius:0px 15px 15px 0px;
            z-index:9999;
             overflow-y: auto;
             text-decoration:none;
        }
        
         .sidebar a {
            color: white;
            text-decoration: none;
        }
        .sidebar a:visited {
            color: white;
        }
        .sidebar.active {
            left: 0;
        }
    .sidebar::-webkit-scrollbar {
            width: 12px;
        }
        .sidebar::-webkit-scrollbar-track {
            background: #001f3f; /* Azul escuro */
            border-radius:2px;
        }
        .sidebar::-webkit-scrollbar-thumb {
            background: #fff; /* Rosa */
            border-radius:3px;
        }

		
/*************menu lateral*********************/