@charset "utf-8";
/* CSS Document */


		.valor_old_bf {
			font-size: 20px;
			font-weight: 500;
			text-decoration: line-through;
		}
        
    
	
		/* - ----- ---   Imagem Principal e ImagenSegmentos     ---------------------------*/
		.containerCAPA {
			display: inline-block;
			border: 2px solid black; /* Borda branca */
			border-radius: 30px; /* Arredondamento da borda */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
			background:#000000;
			box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* Sombra */
		}
		
		.containerCAPA img {
			display: block;
			width: 100%;
			height: auto;
			border-radius: 15px; /* Garante que a imagem também fique arredondada */
		}
		
		.card {
            background-color: #333;
            border: none;
            margin: 10px 10px 10px 10px;
            transition: transform 0.3s ease;
            display: flex;
            flex-direction: column;
            justify-content: space-between; /* Centraliza o conteúdo verticalmente */
            height: 100%; /* Garante que todos os cards tenham a mesma altura */
			border-radius: 20px 20px 20px 20px;
			
			box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
        }
		
		.card:hover {
            transform: scale(1.05);
			border-radius: 20px 20px 20px 20px;
			border: 1px solid black; /* Borda branca */
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
        }
		


        .card img {
            width: 100%;
            height: auto;
            border-radius: 20px 20px 0 0;
        }

        .card-body {
            padding: 10px 10px 10px 10px;/*????????? Pode ser.....*/
            color: white; /* Texto claro dentro do card */
            display: flex;
            flex-direction: column;
			border-radius: 0px 0px 20px 20px;
            justify-content: space-between; /* Centraliza o conteúdo verticalmente */
            flex-grow: 1; /* Faz o card-body ocupar o espaço restante */
			background-image: linear-gradient(to right, #424242, #484848, #4e4e4e, #555555, #5b5b5b, #5b5b5b, #5b5b5b, #5b5b5b, #555555, #4e4e4e, #484848, #424242);
        }
		.card-title {
		  color: #FFFFFF;
		  font-family: "Paralucent", Sans-serif;
		  font-size: 1.2em;
		  font-weight: 600;
		  margin-bottom: -5px; /* Reduz o espaçamento abaixo do título */
		}
		.card-description {
		  color: #B4B7B8;
		  font-family: "Paralucent", Sans-serif;
		  font-size: 1em;
		  font-weight: 400;
		  margin-top: -10px; /* Reduz o espaçamento acima da descrição */
		}
		
		
	@media screen and (max-width: 576px){
		.caixaTextoSegmentos {
            margin: 5px; /* Margem de 11px */
            color: white; /* Texto na cor branca */
            text-align: center; /* Texto justificado */
            padding: 5px; /* Espaçamento interno para melhorar a aparência */
            border-radius: 5px; /* Bordas arredondadas */
			font-size:20px;
        }
		.ImagemTopico{
            width: 100%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
    		margin: 0 auto;
			border: 2px solid black; /* Borda branca */
			border-radius: 30px; /* Arredondamento da borda */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
			box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* Sombra */
        }
		.CaixaTopico{
            width: 90%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
        }
		.CaixaSmile{
			width:80%;
			height:140px;
			font-size:10px;
			text-align:center;
			color:#FFFFFF;
			font-weight: 500;
			padding: 10px 10px 10px 10px;
			border: 0px solid;
			border-color:#c3c3c3;
			background-image: linear-gradient(to bottom, #363636, #3f3f3f, #484848, #515151, #5b5b5b, #5b5b5b, #5b5b5b, #5b5b5b, #515151, #484848, #3f3f3f, #363636);
			border-radius: 6em 6em 6em 0em;
			border: 2px solid #868686;
			transition: all 0.3s ease-in-out;
			box-shadow: 0px 0px 14px rgba(000,000,000,0.7), inset 0px 0px 3px rgba(0,0,0,0.6);
			text-shadow: 0px -1px 0px rgba(000,000,000,0), 0px 1px 0px rgba(255,255,255,0);
		}
		.CaixaForm{
			width:300px;
			min-width:250px;
			height:auto;
			font-size:14px;
			text-align:center;
			color:#000000;
			padding: 10px 10px 10px 10px;
			border-radius: 3em 0em 2em 0em;
			border: 1px solid;
			border-color:#c3c3c3;
			background:transparent;
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
		}

	}
	@media screen and (min-width: 577px) and (max-width: 768px){
		.caixaTextoSegmentos {
            margin: 5px; /* Margem de 11px */
            color: white; /* Texto na cor branca */
            text-align: center; /* Texto justificado */
            padding: 5px; /* Espaçamento interno para melhorar a aparência */
            border-radius: 5px; /* Bordas arredondadas */
			font-size:18px;
        }
		.ImagemTopico{
            width: 100%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
    		margin: 0 auto;
			border: 2px solid black; /* Borda branca */
			border-radius: 30px; /* Arredondamento da borda */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
			box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* Sombra */
        }
		.CaixaTopico{
            width: 70%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
        }
		.CaixaSmile{
			width:80%;
			height:180px;
			font-size:10px;
			text-align:center;
			color:#FFFFFF;
			font-weight: 500;
			padding: 10px 10px 10px 10px;
			border: 0px solid;
			border-color:#c3c3c3;
			background-image: linear-gradient(to bottom, #363636, #3f3f3f, #484848, #515151, #5b5b5b, #5b5b5b, #5b5b5b, #5b5b5b, #515151, #484848, #3f3f3f, #363636);
			border-radius: 6em 6em 6em 0em;
			border: 2px solid #868686;
			transition: all 0.3s ease-in-out;
			box-shadow: 0px 0px 14px rgba(000,000,000,0.7), inset 0px 0px 3px rgba(0,0,0,0.6);
			text-shadow: 0px -1px 0px rgba(000,000,000,0), 0px 1px 0px rgba(255,255,255,0);
		}
		.CaixaForm{
			width:300px;
			min-width:250px;
			height:auto;
			font-size:14px;
			text-align:center;
			color:#000000;
			padding: 10px 10px 10px 10px;
			border-radius: 3em 0em 2em 0em;
			border: 1px solid;
			border-color:#c3c3c3;
			background:transparent;
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
		}

	}
	@media screen and (min-width: 769px) and (max-width: 992px){
		.caixaTextoSegmentos {
            margin: 5px; /* Margem de 11px */
            color: white; /* Texto na cor branca */
            text-align: justify; /* Texto justificado */
            padding: 5px; /* Espaçamento interno para melhorar a aparência */
            border-radius: 5px; /* Bordas arredondadas */
			font-size:18px;
        }
		.ImagemTopico{
            width: 95%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
    		margin: 0 auto;
			border: 2px solid black; /* Borda branca */
			border-radius: 30px; /* Arredondamento da borda */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
			box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* Sombra */
        }
		.CaixaTopico{
            width: 65%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
        }
		.CaixaSmile{
			width:60%;
			height:160px;
			font-size:10px;
			text-align:center;
			color:#FFFFFF;
			font-weight: 500;
			padding: 10px 10px 10px 10px;
			border: 0px solid;
			border-color:#c3c3c3;
			background-image: linear-gradient(to bottom, #363636, #3f3f3f, #484848, #515151, #5b5b5b, #5b5b5b, #5b5b5b, #5b5b5b, #515151, #484848, #3f3f3f, #363636);
			border-radius: 6em 6em 6em 0em;
			border: 2px solid #868686;
			transition: all 0.3s ease-in-out;
			box-shadow: 0px 0px 14px rgba(000,000,000,0.7), inset 0px 0px 3px rgba(0,0,0,0.6);
			text-shadow: 0px -1px 0px rgba(000,000,000,0), 0px 1px 0px rgba(255,255,255,0);
		}
		.CaixaForm{
			width:300px;
			min-width:250px;
			height:auto;
			font-size:14px;
			text-align:center;
			color:#000000;
			padding: 10px 10px 10px 10px;
			border-radius: 3em 0em 2em 0em;
			border: 1px solid;
			border-color:#c3c3c3;
			background:transparent;
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
		}

	}
	@media screen and (min-width: 993px) and (max-width: 1200px){
		.caixaTextoSegmentos {
            margin: 5px; /* Margem de 11px */
            color: white; /* Texto na cor branca */
            text-align: justify; /* Texto justificado */
            padding: 5px; /* Espaçamento interno para melhorar a aparência */
            border-radius: 5px; /* Bordas arredondadas */
			font-size:14px;
        }
		.ImagemTopico{
            width: 80%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
    		margin: 0 auto;
			border: 2px solid black; /* Borda branca */
			border-radius: 30px; /* Arredondamento da borda */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
			box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* Sombra */
        }
		.CaixaTopico{
            width: 65%; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
        }
		.CaixaSmile{
			width:45%;
			height:180px;
			font-size:10px;
			text-align:center;
			color:#FFFFFF;
			font-weight: 500;
			padding: 10px 10px 10px 10px;
			border: 0px solid;
			border-color:#c3c3c3;
			background-image: linear-gradient(to bottom, #363636, #3f3f3f, #484848, #515151, #5b5b5b, #5b5b5b, #5b5b5b, #5b5b5b, #515151, #484848, #3f3f3f, #363636);
			border-radius: 6em 6em 6em 0em;
			border: 2px solid #868686;
			transition: all 0.3s ease-in-out;
			box-shadow: 0px 0px 14px rgba(000,000,000,0.7), inset 0px 0px 3px rgba(0,0,0,0.6);
			text-shadow: 0px -1px 0px rgba(000,000,000,0), 0px 1px 0px rgba(255,255,255,0);
		}
		.CaixaForm{
			width:300px;
			min-width:250px;
			height:auto;
			font-size:14px;
			text-align:center;
			color:#000000;
			padding: 10px 10px 10px 10px;
			border-radius: 3em 0em 2em 0em;
			border: 1px solid;
			border-color:#c3c3c3;
			background:transparent;
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
		}
	}
	
	@media screen and (min-width: 1201px) and (max-width: 1600px){
		.caixaTextoSegmentos {
            margin: 5px; /* Margem de 11px */
            color: white; /* Texto na cor branca */
            text-align: justify; /* Texto justificado */
            padding: 5px; /* Espaçamento interno para melhorar a aparência */
            border-radius: 5px; /* Bordas arredondadas */
			font-size:14px;
        }
		.ImagemTopico{
            width: 800px; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
    		margin: 0 auto;
			border: 2px solid black; /* Borda branca */
			border-radius: 30px; /* Arredondamento da borda */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
			box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* Sombra */
        }
		.CaixaTopico{
            width: 700px; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
        }
		.CaixaSmile{
			width: 550px;
			height:180px;
			font-size:14px;
			text-align:center;
			color:#FFFFFF;
			font-weight: 500;
			padding: 10px 10px 10px 10px;
			border: 0px solid;
			border-color:#c3c3c3;
			background-image: linear-gradient(to bottom, #363636, #3f3f3f, #484848, #515151, #5b5b5b, #5b5b5b, #5b5b5b, #5b5b5b, #515151, #484848, #3f3f3f, #363636);
			border-radius: 6em 6em 6em 0em;
			border: 2px solid #868686;
			transition: all 0.3s ease-in-out;
			box-shadow: 0px 0px 14px rgba(000,000,000,0.7), inset 0px 0px 3px rgba(0,0,0,0.6);
			text-shadow: 0px -1px 0px rgba(000,000,000,0), 0px 1px 0px rgba(255,255,255,0);
		}
		.CaixaForm{
			width:300px;
			min-width:250px;
			height:auto;
			font-size:14px;
			text-align:center;
			color:#000000;
			padding: 10px 10px 10px 10px;
			border-radius: 3em 0em 2em 0em;
			border: 1px solid;
			border-color:#c3c3c3;
			background:transparent;
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
		}
	}
	@media screen and (min-width: 1601px){
		.caixaTextoSegmentos {
            margin: 5px; /* Margem de 11px */
            color: white; /* Texto na cor branca */
            text-align: justify; /* Texto justificado */
            padding: 5px; /* Espaçamento interno para melhorar a aparência */
            border-radius: 5px; /* Bordas arredondadas */
			font-size:14px;
        }
		.ImagemTopico{
            width: 800px; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
    		margin: 0 auto;
			border: 2px solid black; /* Borda branca */
			border-radius: 30px; /* Arredondamento da borda */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
			box-shadow: 3px 3px 10px rgba(0, 0, 0, 0.3); /* Sombra */
        }
		.CaixaTopico{
            width: 700px; 
            transition: transform 0.3s ease;
			display: block; /* Transforma a imagem em um elemento de bloco */
			overflow: hidden; /* Garante que a imagem siga o arredondamento */
        }
		.CaixaSmile{
			width: 600px;
			height:190px;
			font-size:14px;
			text-align:center;
			color:#FFFFFF;
			font-weight: 500;
			padding: 10px 10px 10px 10px;
			border: 0px solid;
			border-color:#c3c3c3;
			background-image: linear-gradient(to bottom, #363636, #3f3f3f, #484848, #515151, #5b5b5b, #5b5b5b, #5b5b5b, #5b5b5b, #515151, #484848, #3f3f3f, #363636);
			border-radius: 6em 6em 6em 0em;
			border: 2px solid #868686;
			transition: all 0.3s ease-in-out;
			box-shadow: 0px 0px 14px rgba(000,000,000,0.7), inset 0px 0px 3px rgba(0,0,0,0.6);
			text-shadow: 0px -1px 0px rgba(000,000,000,0), 0px 1px 0px rgba(255,255,255,0);
		}
		.CaixaForm{
			width:300px;
			min-width:250px;
			height:auto;
			font-size:14px;
			text-align:center;
			color:#000000;
			padding: 10px 10px 10px 10px;
			border-radius: 3em 0em 2em 0em;
			border: 1px solid;
			border-color:#c3c3c3;
			background:transparent;
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			-webkit-box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
			box-shadow:
				0px 0px 10px rgba(000,000,000,0.3),
				inset 0px 0px 3px rgba(0,0,0,0.3);
		}

	}
