@charset "utf-8";

.bkmenutop{
	width:100%;
	height:85px;
	background:#000;
	position: fixed;
	top:0;
	}
.largura_menutop{
	max-width:1280px;
	height:85px;
	margin:auto;
	display: flex;
	align-items: center; 
	}	
@media(max-width:1280px){
	.largura_menutop{
	max-width:90%;
	}
	}	
.BTmenu{
	width:50px;
	height:50px;
	background: #000 url(../imagens/menu/bt_menu.svg) no-repeat center center;
	cursor:pointer;
	margin-left:15px;
	}
.BTabri_busca{
	width:50px;
	height:50px;
	background: #000 url(../imagens/menu/bt_pesquisar.svg) no-repeat center center;
	cursor:pointer;
	margin-right:15px;
	}		

.BTCompreFacil,
.BTCompreFacil:visited
.BTCompreFacil:active{
	width:auto;
	height:50px;
	padding-left:50px;
	padding-right:35px;
	background: url(../imagens/menu/bt-comprefacil.svg) left center no-repeat;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color:#FFF;
	text-decoration:none;
	position:relative;
	}	
.BTCompreFacil:hover{
	color:#CCC;
	}	
/* Adicionando o ícone no lado direito */
.BTCompreFacil::after {
    content: '';
    width: 50px; /* Largura do ícone */
    height: 50px; /* Altura do ícone */
    background: url(../imagens/menu/verMais.png) right center no-repeat;
    position: absolute;
    right: 0;
}
.SubCompreFacil{
	position:absolute;
	right:0; 
	top:0;
	width:250px;
	padding:15px;
	border-radius:10px;
	background: #FFF;
	border:1px solid #CCC;
	display:none;
	transition:0.2s ease-in-out;
	color:#000;
	}
.BTCompreFacil:hover .SubCompreFacil{
	display:block;
	top:50px;
	} 			
	
.BTCentralAtende,
.BTCentralAtende:visited
.BTCentralAtende:active{
	width:auto;
	height:50px;
	padding-left:50px;
	padding-right:35px;
	background: url(../imagens/menu/bt_centraAntend.svg) left center no-repeat;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color:#FFF;
	text-decoration:none;
	position:relative;
	}	
.BTCentralAtende:hover{
	color:#CCC;
	}	
/* Adicionando o ícone no lado direito */
.BTCentralAtende::after {
    content: '';
    width: 50px; /* Largura do ícone */
    height: 50px; /* Altura do ícone */
    background: url(../imagens/menu/verMais.png) right center no-repeat;
    position: absolute;
    right: 0;
}
.SubCentralAtende{
	position:absolute;
	right:0; 
	top:0;
	width:250px;
	padding:15px;
	border-radius:10px;
	background: #FFF;
	border:1px solid #CCC;
	display:none;
	transition:0.2s ease-in-out;
	}
.BTCentralAtende:hover .SubCentralAtende{
	display:block;
	top:50px;
	} 			
	
.BTTemaCriativo,
.BTTemaCriativo:visited,
.BTTemaCriativo:active {
    width: auto;
    height: 50px;
    padding-left: 45px;
    padding-right: 35px;
    background: url(../imagens/menu/bt_temaCriativo.svg) left center no-repeat;
    cursor: pointer;
    transition: 0.2s ease-in-out;
    display: flex;
    align-items: center;
    font-family: 'Rubik', Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 400;
    color: #FFF;
    text-decoration: none;
    position: relative;
}
.BTTemaCriativo:hover{
	color:#CCC;
	}
/* Adicionando o ícone no lado direito */
.BTTemaCriativo::after {
    content: '';
    width: 50px; /* Largura do ícone */
    height: 50px; /* Altura do ícone */
    background: url(../imagens/menu/verMais.png) right center no-repeat;
    position: absolute;
    right: 0;
}
.SubTemaCriativo{
	position:absolute;
	right:0; 
	top:0;
	width:400px;
	padding:15px;
	border-radius:10px;
	background: #FFF;
	border:1px solid #CCC;
	display:none;
	transition:0.2s ease-in-out;
	color:#000;
	}
.BTTemaCriativo:hover .SubTemaCriativo{
	display:block;
	top:50px;
	} 	
	
.BTProdutosM,
.BTProdutosM:visited
.BTProdutosM:active{
	width:auto;
	height:50px;
	padding-left:45px;
	padding-right:35px;
	background: url(../imagens/menu/bt_produtos.svg) left center no-repeat;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color:#FFF;
	text-decoration:none;
	position:relative;
	    margin-left: auto; /*dados a esquerda*/
	}	
.BTProdutosM:hover{
	color:#CCC;
	}	
/* Adicionando o ícone no lado direito */
.BTProdutosM::after {
    content: '';
    width: 50px; /* Largura do ícone */
    height: 50px; /* Altura do ícone */
    background: url(../imagens/menu/verMais.png) right center no-repeat;
    position: absolute;
    right: 0;
}
.SubProdutosM{
	position:absolute;
	right:0; 
	top:0;
	width:350px;
	padding:15px;
	border-radius:10px;
	background: #FFF;
	border:1px solid #CCC;
	display:none;
	transition:0.2s ease-in-out;
	color:#000;
	}
.BTProdutosM:hover .SubProdutosM{
	display:block;
	top:50px;
	} 			
@media(max-width:980px){
	.BTProdutosM{ display:none;}
	.BTTemaCriativo{margin-left: auto; }
	}
@media(max-width:780px){
	.BTTemaCriativo{ display:none;}
	.BTCentralAtende{margin-left: auto; }
	}				
@media(max-width:625px){
	.BTCompreFacil{ display:none;}
	.BTCentralAtende{margin-left: auto;}
	}	
@media(min-width:390px){
	.Slogan{ display:none;}
	}	
@media(max-width:390px){
	.BTCentralAtende{ display:none;}
	.BTabri_busca{margin-left: auto; margin-right:0;}
	.BTmenu{ margin-left: auto; margin-right:0;}
		.Slogan{
		height:50px; color: #FFF; border-left:1px solid #333; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; font-size:13px; font-style: italic; display: flex;
	align-items: center; padding-left:15px; margin-left:15px; }
	}	

.BTProduto {
	width:calc(50% - 4px); 
	margin:2px;
	float:left;
	height:50px;
	padding-left:50px;
	padding-right:25px;
	background:#FFF url(../imagens/menu/bt_caneca.svg) left center no-repeat;
	border-radius:10px;
	border:1px solid #CCC;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color: #000;
	text-decoration:none;
	}	
.BPCaneca {background: #FFF url(../imagens/menu/bt_caneca.svg) left center no-repeat;}
.BPCamiseta {background: #FFF url(../imagens/menu/bt_camiseta.svg) left center no-repeat;}
.BPAlmofada {background: #FFF url(../imagens/menu/bt_almofada.svg) left center no-repeat;}
.BPQuadro {background: #FFF url(../imagens/menu/bt_quadro.svg) left center no-repeat;}
.BPSqueeze {background: #FFF url(../imagens/menu/bt_squeeze.svg) left center no-repeat;}
.BPChinelo {background: #FFF url(../imagens/menu/bt_chinelo.svg) left center no-repeat;}	

.BTProduto:hover{ background:#000; color:#FFF;}	
.BPCaneca:hover{background: #000 url(../imagens/menu/bt_caneca.svg) left center no-repeat;}
.BPCamiseta:hover{background: #000 url(../imagens/menu/bt_camiseta.svg) left center no-repeat;}
.BPAlmofada:hover{background: #000 url(../imagens/menu/bt_almofada.svg) left center no-repeat;}
.BPQuadro:hover{background: #000 url(../imagens/menu/bt_quadro.svg) left center no-repeat;}
.BPSqueeze:hover{background: #000 url(../imagens/menu/bt_squeeze.svg) left center no-repeat;}
.BPChinelo:hover{background: #000 url(../imagens/menu/bt_chinelo.svg) left center no-repeat;}			

.BTtemas{
	width:calc(50% - 4px);
	margin:2px;
	padding:5px;
	float:left;
	color:#000;
	text-decoration:none;
	transition:0.2s ease-in-out;
	}
.BTtemasDois{
	width:calc(100% - 4px);
	margin:2px;
	padding:5px;
	float:left;
	text-decoration:none;
	transition:0.2s ease-in-out;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color: #000; text-align:left;
	text-decoration:none;
	}
.BTtemas:hover, .BTtemasDois:hover{
	padding:5px;
	border-radius:5px;
	background: #000;
	color:#FFF;
	}	

.CCwhtasapp{
	width:calc(100% - 4px); 
	margin:2px;
	float:left;
	height:50px;
	padding-left:50px;
	padding-right:25px;
	background:#FFF url(../imagens/menu/bt_whatsVerde.svg) left center no-repeat;
	border-radius:10px;
	border:1px solid #CCC;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	flex-wrap: wrap;/*quebralinha*/
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:500; color: #000;
	text-decoration:none;
		}
		.btVendas{ width:100%; font-size: 14px; margin-bottom: 0; font-weight:400;}
		.PhoneVendas{margin-top: -15px;}
.CCwhtasapp:hover{
	background: #000 url(../imagens/menu/bt_whatsVerde.svg) left center no-repeat;
	color:#FFF;
	}
.CCemail{
	width:calc(100% - 4px); 
	margin:2px;
	float:left;
	height:50px;
	padding-left:50px;
	padding-right:25px;
	background:#FFF url(../imagens/menu/bt_email.svg) left center no-repeat;
	border-radius:10px;
	border:1px solid #CCC;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color: #000;
	text-decoration:none;
	}
.CCatendimento{
	width:calc(100% - 4px); 
	margin:2px;
	float:left;
	height:50px;
	padding-left:50px;
	padding-right:25px;
	background:#FFF url(../imagens/menu/bt_atendimento.svg) left center no-repeat;
	border-radius:10px;
	border:1px solid #CCC;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	flex-wrap: wrap;/*quebralinha*/
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color: #000;
	text-decoration:none;
	}	
.CCemail:hover{background: #000 url(../imagens/menu/bt_email.svg) left center no-repeat; color:#FFF;}
.CCatendimento:hover{background: #000 url(../imagens/menu/bt_atendimento.svg) left center no-repeat; color:#FFF;
}

.CPwhasapp{
	width:calc(100% - 4px); 
	margin:2px;
	float:left;
	height:50px;
	padding-left:50px;
	padding-right:25px;
	background:#00dc00 url(../imagens/menu/bt_whatsBranco.svg) left center no-repeat;
	border-radius:10px;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:500; color: #FFF;
	text-decoration:none;
	}
.CPmercadolivre{
	width:calc(100% - 4px); 
	margin:2px;
	float:left;
	height:50px;
	padding-left:50px;
	padding-right:25px;
	background:#ffe600 url(../imagens/menu/bt_mercadolivre.svg) left center no-repeat;
	border-radius:10px;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:500; color: #000d8f;
	text-decoration:none;
	}
.CPwhasapp:hover{background: #000 url(../imagens/menu/bt_whatsBranco.svg) left center no-repeat; color:#FFF;}	
.CPmercadolivre:hover{background:#000 url(../imagens/menu/bt_mercadolivre.svg) left center no-repeat; color:#FFF;}

/* MENU MOBILE */
.painel_Menu {
    width: 310px; 
    padding: 25px;
    height: 100vh;
    position: fixed;
    left: 0rem; 
    top: 0rem;
    background: #FFF;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
    text-align: center;
    display: none;
    /* BARRA DE ROLAGEM QUANDO PRECISAR */
    scrollbar-width: thin !important;
    scrollbar-color: transparent transparent; /* Aqui, não pode usar !important duas vezes na mesma linha */
    overflow-x: hidden;
    z-index: 900;
}	
.BTfechar_Menu,
.BTfechar_Menu:visited,
.BTfechar_Menu:active{
	width:50px;
	height:50px;
	position:fixed;
	left:295px; top:0;
	border-radius:10px;
	z-index: 2;
	background: #FFF url(../imagens/menu/bt_fechar.svg) no-repeat center center;
	box-shadow: 10px 10px 10px 0px rgba(0, 0, 0, 0.2);
	cursor:pointer;
	transition:ease-in-out 0.2s;
	border:none;
	user-select: none;
	}	
/* PAINEL BUSCA */	
.painel_busca {
    width: 300px; 
    padding: 25px;
    height: 100vh;
    position: fixed;
    right: 0rem; 
    top: 0rem;
    background: #FFF;
    box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.3);
    text-align: center;
    display: none;
    /* BARRA DE ROLAGEM QUANDO PRECISAR */
    scrollbar-width: thin !important;
    scrollbar-color: transparent transparent; /* Removido o !important duplicado */
    overflow-x: hidden;
    z-index: 900;
}
.BTfechar_busca,
.BTfechar_busca:visited,
.BTfechar_busca:active{
	width:50px;
	height:50px;
	position:fixed;
	right:285px; top:0;
	border-radius:10px;
	z-index:2;
	background: #FFF url(../imagens/menu/bt_fechar.svg) no-repeat center center;
	box-shadow: -10px 10px 10px 0px rgba(0, 0, 0, 0.2);
	cursor:pointer;
	transition:ease-in-out 0.2s;
	border:none;
	user-select: none;
	}	

/*MENU PADRÃO*/
.BTmenuP{
	width:auto;
	height:50px;
	padding-left:50px;
	padding-right:20px;
	margin-bottom:5px;
	border-radius:10px;
	background: #000;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:16px; font-weight:400; color:#FFF; text-align:left;
	text-decoration:none;
	position:relative;
	}
.BTmenuPX{
	width:auto;
	height:50px;
	padding-left:50px;
	padding-right:20px;
	margin-bottom:5px;
	border-radius:10px;
	background: #000;
	cursor:pointer;
	transition:0.2s ease-in-out;
	display: flex;
	align-items: center;
	font-family:'Rubik',Arial, Helvetica, sans-serif; font-size:15px; font-weight:400; color:#FFF; text-align:left;
	text-decoration:none;
	position:relative;
	}	
.BTmenuP:hover, .BTmenuPX:hover{
	color: #999; background-color: #333;
	}
.BTmenuPX.active{
	color: #999; background-color: #333;
	}
.BTmenuPX:after{
	width:30px; height:30px; position:absolute; right:0; top:0; content: url(../imagens/menu/abriMais.png);
	}	
.BTmenuPX.active:after{
	content: url(../imagens/menu/abriMais2.png);
	}	
/*conteudo*/
div.conteudo_BTmenuPX {
	max-width:100%;
	height: auto;
	padding:5px;
	border-radius:10px;
	margin-bottom:5px;
	margin-top:0;
	border:0;
	overflow: hidden;
	transition: 0.2s ease-in-out;
	opacity: 0;
	display:none;
}
div.conteudo_BTmenuPX.show {opacity:1; max-height:100%; display:block; margin-top:0; background: #f1f1f2;
}	
.BTmenuP_TemasCriativo{ background: #000 url(../imagens/menu/bt_temaCriativo.svg) no-repeat left center;}
.BTmenuP_Produtos{ background: #000 url(../imagens/menu/bt_produtos.svg) no-repeat left center;}
.BTmenuP_CompraFacil{ background: #000 url(../imagens/menu/bt-comprefacil.svg) no-repeat left center;}
.BTmenuP_CentralAtendimento{ background: #000 url(../imagens/menu/bt_atendimento.svg) no-repeat left center;}
.BTmenuP_Institucional{ background: #000 url(../imagens/menu/bt_institucinal.svg) no-repeat left center;}

/*SISTEMA DE BUSCA*/
 /* Campo de Pesquisa */		
.Cpesquisa{
	width: calc(100% - 50px);
    height:50px;
	padding-left:50px;
    margin-bottom:20px;
    border:1px solid #CCC;
	float:left;
	background: #FFF url(../imagens/menu/ico_pesquisa.svg) left 17px center no-repeat;
	font-family: 'Rubik',Arial, sans-serif; font-size: 16px; font-weight:400; color: #000; text-align: left;
	border-radius:10px;
	z-index:999;
	}	
 /* Botão Pesquisa */
.search-button,
.search-button:active,
.search-button:visited {
	width:100%;
	height: 50px;
	margin-bottom:25px;
	border-radius:10px;
	background: #000; 
	border:0;
	font-family: 'Rubik',Arial, sans-serif; color: #FFF; font-size:16px; font-weight:400;
	cursor:pointer;
	user-select: none; /*tirando seletor de texto da div*/
	transition:ease-in-out 0.2s;
}
.search-button:hover{
	color: #999; background-color: #333;
	 }	
/* Notificação não resultados*/
.notification, .no-results {
	max-width:100vw;
	text-align:center;
	font-family: 'Rubik',Arial, sans-serif; font-size:16px; font-weight:400; color: #000; text-align: center;
}
/* Quadro Resultado */
.result-container {
    display: flex;
    align-items: center;
    margin-bottom: 20px; /* Adiciona espaço entre os resultados */
}

/* Resultado Imagem */
.result-image {
    max-width: 100px; /* Largura máxima para as imagens */
    max-height: 100px; /* Altura máxima para as imagens */
    margin-right: 10px; /* Adiciona espaço entre a imagem e o texto */
}

/* Conteúdo do Resultado */
.result-content {
    display: flex;
    flex-direction: column;
    justify-content: center; /* Alinha o conteúdo verticalmente ao centro */
}

/* Estilos para o link do site */
.result-link,
.result-link:visited,
.result-link:active {
    text-decoration: none; /* Remove o sublinhado padrão do link */
    font-family: 'Rubik', Arial, sans-serif;
    font-size: 14px;
    font-weight: 700;
    color: #000;
    display: flex; /* Faz com que o link ocupe o espaço do contêiner */
    align-items: center; /* Alinha os itens verticalmente no centro */
    transition: ease-in-out 0.2s;
}

/* Hover do link */
.result-link:hover {
    text-decoration: underline;
    color: #F00;
}

/* Estilos para a descrição */
.result-description {
    font-family: 'Rubik', Arial, sans-serif;
    font-size: 14px;
    font-weight: 400;
    color: #000;
    text-align: left;
}

/* Estilos para o título */
.result-title {
    font-family: 'Rubik', Arial, sans-serif;
    font-size: 14px;
    font-weight: 500;
    color: #000;
    text-align: left;
}