@import url('./css/roboto.css');

*{margin: 0px; animation-duration: 2s; padding: 0px; font-family: Roboto, arial, verdana; font-weight: 400; text-decoration:none; border: 0px; outline: 0px;}

body{background: var(--cinza02); z-index: 1; /*cursor: url('../imgSite/ufo_01.png'), auto;*/}

a{text-decoration: none; color: var(--preto); font-weight:400;}
a:hover{font-weight:500;}
h1{font-size: 16px; margin-bottom: 5px; text-transform: uppercase; font-weight: 400;}
h2{font-size: 18px; margin-bottom: 5px; text-transform: uppercase; font-weight: 400;}
h3{font-size: 24px; margin-bottom: 5px; text-transform: uppercase; font-weight: 500;}
h4{font-size: 28px; margin-bottom: 5px; text-transform: uppercase; font-weight: 500;}
b{font-weight: 500;}

hr{border-bottom: 1px dotted var(--roxo); margin: 10px auto;}

input{padding: 10px; margin-bottom: 5px; border-radius: 3px; background: var(--cinza01);}
input[type=button]{min-width: 100px; padding: 10px 10px; background: var(--roxo); font-weight: 500; text-transform: uppercase; color: var(--branco); cursor: pointer;}
select{padding: 10px; margin-bottom: 5px; border-radius: 3px;}
textarea{background: var(--cinza02); padding: 5px; margin-bottom: 5px; border-radius: 3px;}

/*REMOVE ARROW FILD NUMBER*/
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{-webkit-appearance: none; margin: 0;}
input[type=number]{-moz-appearance: textfield;}

	.msgAviso{position: relative; width: 90%; margin: 10px auto; padding: 10px; color: var(--vermelho); background: var(--vermelho10); text-align: center; font-size: 14px; border-bottom: 1px solid var(--vermelho); border-radius: 5px;}
		.msgAviso a{color: var(--vermelho) !important;}
	.msgAlert{position: relative; width: 90%; margin: 10px auto; padding: 10px; color: var(--cinza05); background: var(--amarelo10); text-align: center; font-size: 14px; border-bottom: 1px solid var(--amarelo); border-radius: 5px;}
		.msgAlert a{color: var(--cinza05) !important;}

	.icoPosition{position: relative; bottom: -2px; margin-right: 5px;}

	.tituloSecao{margin: 0px; margin-bottom: 10px; padding: 5px 10px; color: var(--roxo); text-align: left; font-size: 22px; font-weight: 500; letter-spacing: 1px; background: url("../imgSite/bgLista.webp"),var(--cinza01); border-radius: 5px;}
	.tituloSecoes{color: var(--roxo); text-align: left !important; font-size: 23px; margin: 10px; font-weight: 500;}
	.tituloSecoesMenu{color: var(--roxo); text-align: center; !important; font-size: 23px; margin: 10px; font-weight: 500;}
	.subTituloSecoes{color: var(--cinza05); text-align: left; margin-bottom: 5px;}

	#modalClick{display: none; position: fixed; left: 0px; top: 0px; padding-top: 34px; width: 100%; height: 100%; background: var(--preto50); z-index: 910; cursor: url('../imgSite/ufo01.gif');/*cursor: wait;*/}
	#modal{display: none; position: fixed; left: 0px; top: 0px; padding-top: 34px; width: 100%; height: 100%; background: var(--preto50); z-index:800;}
	#modalContent{display: none; position: relative; width: 330px; margin: 0px auto; margin-top: 40px; margin-bottom: 30px; padding: 10px; padding-bottom: 40px; color: #fff; text-align: center; background: linear-gradient(to right,var(--cinza02),var(--branco),var(--cinza02)); border-radius: 8px 15px 8px 15px; z-index:900;}
		.modalBtCronograma{position: fixed; margin: 0 auto; top: -20px; background: var(--roxo); padding: 5px; border-radius: 0 0 5px 5px; z-index: 900;}
		.closeUp{position: absolute; right: 0px; top:0px; padding: 5px; font-size: 10px; width: 12px; background: var(--vermelho); color: var(--branco); border-radius: 0 8px 0 8px; overflow: hidden; cursor: pointer;}
		.closeDown{position: absolute; left: 165px; bottom: 0px; padding: 5px; font-size: 10px; width: 12px; background: var(--vermelho); color: var(--branco); border-radius: 8px 8px 0px 0px; overflow: hidden; cursor: pointer;}
		.admBtEditInternas{position: absolute; left: 0px; top: 0px; padding: 5px; font-size: 10px; min-width: 22px; background: var(--verde); color: var(--branco); border-radius: 8px 0px 8px 0px; overflow: hidden; cursor: pointer;}

	/* ESTRUTURA */
	#chapadaStore{display: none;}
	#chapada{position: absolute; top: 0px; width: 100%; margin: 0px auto; border-radius: 5px; overflow: hidden;}

		#menuBox{position: fixed; justify-content: center; display: flex; top: 0px; z-index: 910; margin: 0px auto; width: 100%; height: 1px; padding-bottom: 10px; border-top: 1px solid var(--roxo);}
			.menuBt{display: flex; align-items: center; justify-content: center; width: 85px; height: 17px; margin: 0px 5px; padding: 5px 10px; text-align: center; font-size: 14px; color: #fff; background: var(--roxo); border-radius: 0 0 5px 5px; cursor: pointer;}

		#login{margin: 10px auto; width: 100%; height: auto;}
			.loginInputLabel1{position: relative; top: 3px; padding: 5px 0px; margin-bottom: 5px; color: var(--roxo); font-size: 17px;}
			.loginInputLabel2{position: relative; margin-top: 10px; padding: 5px 0px; color: var(--cinza05); font-size: 15px;}
				.loginInputLogin{width: 300px; margin: 0px 5px; padding: 10px 5px; background: var(--cinza01); color: var(--cinza05); font-weight: 400; font-size: 21px; letter-spacing: 3px; text-align: center; border: 1px dotted var(--cinza03); overflow: hidden;}
				.loginInputLogin:focus{border: 1px solid var(--roxo); color: var(--roxo); font-weight: 600;}
				.loginInputButton{position: relative; top: 2px; padding: 5px; color: var(--branco); background: var(--roxo);}

				.loginBtControle{position: relative; font-size: 14px; color: var(--vermelho); margin-top: 20px;}
				.loginBtControle a{font-size: 14px; color: var(--vermelho);}
				#localizacaoStatus,#loginLongitude,#loginLatitude{color: var(--cinza05);}

			.menuLoginTopo{position: relative; display: flex; flex-wrap: nowrap; align-items: center; margin-bottom: 10px; height: 30px; padding: 10px; padding-top: 0px; background: linear-gradient(to top,var(--cinza01),var(--branco)); border-bottom: 1px dotted var(--roxo70); z-index: 1;}
				.menuLoginTopoImg{width: 40px; height: 40px; margin-right: 10px; border-radius: 50%; overflow: hidden;}
				.menuLoginTopoUsu{width: 100%; height: 20px; overflow: hidden;}

		#perfil{position: relative;}
			.perfilDados{position: relative; width: 330px; display: flex; flex-direction: row; flex-flow: row; flex-wrap: wrap; margin-bottom: 0px;}
				.perfilDadosBoxDados{width: 180px; overflow: hidden;}
				.perfilBtSalvar{display: none; position: absolute; right: 0px; top: 0px; width: 150px; height: 143px; align-items: center; justify-content: center; background: var(--cinza02); overflow: hidden;}
				.perfilDadosBoxMapa{width: 140px; padding: 5px; font-size: 12px; background: var(--cinza02); overflow: hidden;}
					.perfilLocation1{display: flex; align-items: center;}
					.perfilLocation2{}

					.perfilDadosTitulo1{display: inline-block; width: 310px; margin: 5px 10px; padding: 5px; text-align: left; font-size: 17px; font-weight: 500; color: var(--cinza05); border-bottom: 1px solid var(--cinza02); cursor: pointer;}
					.perfilDadosTitulo1:hover{color: var(--roxo);}
					.perfilDadosTitulo2{margin: 5px 10px; font-size: 15px; color: var(--cinza05);}
					.perfilDadosMenuItem{display: inline-block; width: 270px; padding-left: 30px; margin: 5px; text-align: left; color: var(--cinza05); cursor: pointer;}
					.perfilDadosMenuItem:hover{color: var(--roxo);}
					.perfilInfo{font-size: 9px; letter-spacing: 1px;}

				.meusProdutosForms{display: none;}
				.meusProdutosFormsBox{position: relative; display: none; width: 310px; height: auto; margin: 0px; margin-top: 10px; padding: 15px 10px; text-align: left; background: var(--cinza02); color: var(--cinza05); border-top: 1px solid var(--roxo50); border-bottom: 1px dotted var(--roxo10); border-radius: 8px; overflow: hidden;}

				.meusProdutosFormsBoxADM{position: relative; display: inline-block; width: 310px; margin: 0px 15px; margin-bottom: 25px; padding: 10px 10px; text-align: left; background: var(--cinza02); color: var(--cinza05); border-top: 1px solid var(--roxo50); border-bottom: 1px dotted var(--roxo10); border-radius: 8px; overflow: hidden;}
				.meusProdutosFormsBoxADMBtBox{display: inline-block; margin: 5px; min-width: 40px; padding: 5px; color: var(--branco); background: var(--roxo); border-radius: 5px; cursor: pointer;}
					.meusProdutosFormsBoxADMBtBox:hover{background: var(--branco); color: var(--roxo) !important;}

					.meusProdutosFormsMenuSuperior{margin: 10px 0px; display: flex; justify-content: space-around;}
						.meusProdutosFormsMenuSuperiorItem{min-width: 80px; font-size: 14px; color: var(--cinza04); cursor: pointer;}

					.meusProdutosFormsTitulo1{font-size: 18px; color: var(--cinza05);}
					.meusProdutosFormsTitulo2{font-size: 15px; color: var(--cinza05);}
					.meusProdutosFormsContagem{font-size: 13px; color: var(--roxo); font-weight: 500;}
					.meusProdutosFormsInfo{font-size: 12px; color: var(--cinza04); font-weight: 400;}
					.meusProdutosFormsDescricao{margin-top: 5px; font-size: 12px; color: var(--cinza04); font-weight: 400;}
					.meusProdutosFormsValor{font-size: 18px; color: var(--cinza06); font-weight: 500;}
					.meusProdutosFormSelect{width: 100%; margin-bottom: 10px; padding: 10px 5px; background: var(--branco); border-bottom: 1px solid var(--cinza04); font-size: 18px; text-align: center;}
					.meusProdutosFormInput{width: 97%; margin-bottom: 10px; padding: 10px 5px; background: var(--branco); border-bottom: 1px solid var(--cinza04); font-size: 18px; text-align: center;}
					.meusProdutosFormInputAnalise{min-width: 80px; padding: 2px !important; margin: 0 auto; background: var(--branco) !important; color: var(--cinza05) !important; font-size: 12px; text-align: center;}

					.meusProdutosSubMenuItem{display: inline-block; font-size: 13px; color: var(--cinza05); font-style: italic;  font-weight: 400;}
					.meusProdutosSubMenuItem:first-child{margin-left: 10px;}

					.meusProdutosStatus0{background: var(--vermelho10); color: var(--preto);}
					.meusProdutosStatus1{background: var(--verde10); color: var(--preto);}

					.meusProdutosBoxBtEdit{position: absolute; right: 0px; top: 0px; width: 20px; height: 20px; background: url("../imgSite/ico_perfil_edit.png"),var(--branco); background-size: 17px; background-position: center; background-repeat: no-repeat; cursor: pointer;}
					.meusProdutosBoxBtImagem{display: block; position: absolute; right: 0px; bottom: 0px; width: 20px; height: 20px; background: url("../imgSite/ico_perfil_cad_imagem.png"),var(--branco); background-size: 17px; background-position: center; background-repeat: no-repeat; cursor: pointer;}

					.meusProdutosImgBox{display: none; justify-content: space-around; width: 300px; padding: 5px; margin-top: 15px; background: var(--roxo10); border-top: 1px dotted var(--roxo70); overflow: hidden;}
						.meusProdutosImgIco{width: 50px; height: 50px; border-radius: 5px; background-position: center; background-repeat: no-repeat; cursor: pointer;}

		#boxBtSistema{display: flex; justify-content: space-between; margin-top: 20px; padding: 5px; padding-top: 10px; text-align: left; border-top: 1px solid var(--roxo30);}
		#boxBtSistema a{ color: var(--roxo);}

		.bannerInternas{position: relative; width: 330px; height: 100px; margin: 30px 0px 20px 0px; background: var(--roxo);}

		.box{position: relative; width: var(--browserWeb1); height: auto; padding-bottom: 10px; margin: 0px auto; background: #fff;}

			#compartilharBox{display: none; position: absolute; left: 0px; top: 0px; width: 100%; height: 80px; background: var(--roxo70); border-radius: 5px;}
			.btCompartilhar{position: absolute; right: 10px; top: 10px; cursor: pointer; z-index: 10; filter: invert(30%);}

			#menuTopo{position: relative; margin: 0px auto; height: 100px; width: var(--browserWeb1); background: linear-gradient(to bottom, #ffffff50,#8400b515); border-bottom: 1px solid var(--roxo);}
				.menuLogo{position: absolute; top: 30px; left: 30px; margin: 0px auto; width: 158px;}

				.menuAdm{position: absolute; right: 10px; top: 10px; text-align: right; font-weight: 400;}
					.menuAdm a{margin: 0 5px;}

			#rodaPe{width: var(--browserWeb1); margin: 0 auto; padding: 20px 0px 40px 0px; text-align: center; font-size: 10px;  color: var(--roxo); font-weight: 500; letter-spacing: 1px; z-index: -1; border-top: 1px solid var(--roxo);}
				.rodaPeLogo{width: 100%; text-align: center; margin-bottom: 10px;}
				.rodaPeFaleConosco{margin-top: 10px; font-weight: 500;}

			#destaque{position: relative; width: var(--browserWeb1); height: 255px; text-align: center; background-size: cover; background-position: center;}
				.destaqueBox{width: var(--browserWeb1); height: 255px; display: flex; align-items: flex-end; justify-content: flex-end;}
					.destaqueConteudo{background: var(--preto50); padding: 3px; border-radius: 5px 0 0 0;}
						.destaqueConteudoTitulos{margin: 0px; color: var(--branco); font-size: 14px; font-weight: 400;}

			.home{position: relative; width: var(--browserWeb1); border-top: 1px solid var(--roxo);}
			.home2{position: relative; width: var(--browserWeb1); border-top: 1px solid var(--roxo); display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between;}

			.btVoltarBusca{min-width: 80px; margin: 0 auto; margin-top: 20px; color: var(--roxo); font-size: 14px; font-weight: 600; text-align: center; cursor: pointer;}

				#guias{position: relative; width: 500px; text-align: center; padding-bottom: 10px;}
					#guiasFlex{display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-around;}
						.guiasItensFlex{width: 80px; height: 132px; overflow: hidden;}
							.guiaDados{cursor: pointer; color: var(--preto);}
							.guiaDados:hover{color: var(--roxo);}
								.guiasItensFlexNomeGuia{margin: 0px; font-size: 12px;}
								.guiasItensFlex i{font-size: 10px;}
									.guiasFotos{width: 78px; height: 78px; margin-bottom: 5px; background: var(--roxo); border-radius: 50%; border-bottom: 2px solid var(--roxo);}
									.guiasAnoInicio{font-size: 10px; margin: -1px;}

					#guiasAjaxBox{width: 320px; margin: 0 auto; padding: 5px; padding-bottom: 10px; color: var(--preto); overflow: hidden; border-radius: 5px; border-bottom: 4px solid var(--cinza05);}
						.guiasAjaxBox{width: 320px; margin: 0 auto; padding: 5px; padding-bottom: 10px; color: var(--preto); overflow: hidden; border-radius: 5px; border-bottom: 4px solid var(--cinza05);}
							.guiasAjaxBoxDados{width: 320px; margin-top: 10px; overflow: hidden; text-align: left;  border-bottom: 2px solid var(--cinza02); border-radius: 5px 0 5px 5px; }
								.guiasAjaxBoxDados i{font-size: 13px; color: var(--cinza04);}
								.guiasAjaxBoxImg{margin-right: 10px;}
								.guiasAjaxBoxTitulo1{font-size: 22px; color: var(--roxo);}
								.guiasAjaxBoxTitulo2{font-size: 18px; color: var(--cinza06); margin: 0px; margin-top: 5px;}
								.guiasAjaxBoxSubTitulo1{font-size: 16px; color: var(--cinza05); margin: 0px;}

					#guiaAjaxBox{width: 320px; margin: 0 auto; padding: 5px; padding-bottom: 10px; color: var(--preto); overflow: hidden; border-radius: 5px; border-bottom: 4px solid var(--cinza05);}
						.guiaAjaxBoxTitulo1{font-size: 22px; color: var(--roxo);}
						.guiaAjaxImagem{width: 180px; height: 180px; margin: 0 auto; margin-bottom: 10px; background-repeat: no-repeat; background-size: contain; border-bottom: 2px solid var(--roxo); border-radius: 50%;}
						.guiaAjaxTitulo{font-size: 25px; color: var(--roxo);}

					.guiaAjaxBoxFotos{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; align-items: center;}
						.guiaAjaxFoto{min-width: 150px; height: 150px; margin: 5px; opacity: 0.7; background: var(--roxo10); border-radius: 5px; cursor: pointer; border-bottom: 2px solid var(--roxo); }
						.guiaAjaxFoto:hover{opacity: 1;}

						.guiaAjaxBoxBt{display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; margin: 13px 0px; padding: 5px; background: url(../imgSite/bgLista.webp), var(--cinza01); border-bottom: 1px solid var(--roxo); border-radius: 5px; box-shadow: rgba(97, 48, 134, 0.40) 0px 3px 8px 0px;}
							.guiaAjaxBoxBt img{margin-bottom: -5px;}
							.guiaAjaxBt{ padding: 5px; font-size: 14px; font-weight: 500; cursor: pointer;}
							.guiaAjaxBt:hover{color: var(--roxo);}

						.guiaAjaxBtInsta{letter-spacing: 2px; margin-top: 10px; font-size: 13px; text-transform: uppercase;}
						.guiaAjaxBtInsta:hover{color: var(--roxo);}

				#tempo{position: absolute; top: 0px; right: 0px; width: 489px; height: 173px; padding-top: 10px; text-align: center; border-left: 1px dotted var(--roxo);}
					#tempo h3{letter-spacing: 2px;}
					#tempo i{font-size: 11px; color: var(--roxo);}

				#encontreAqui{width: 500px; position: relative;}
					#encontreAquiFlex{display: flex; flex-direction: row; flex-wrap: nowrap; margin-bottom: 10px; margin-left: 10px; border-radius: 0 0 5px 5px; border-bottom: 2px solid var(--cinza02); background: linear-gradient(to right, var(--cinza02),var(--branco)); cursor: pointer;}
						.encontreAquiItensFlex1{width: 170px; height: 76px; overflow: hidden; background: var(--cinza05); color: var(--branco); border-bottom: 1px solid var(cinza03);  border-radius: 5px 0 0 5px;}
						.encontreAquiItensFlex2{width: 300px; height: 66px; overflow: hidden; padding: 5px; padding-left: 10px; text-align: left; color: var(--preto);}
						.encontreAquiItensFlex2:hover{background: linear-gradient(to right, var(--roxo10),var(--branco)); color: var(--roxo) !important;}
						.encontreAquiItensFlex2 h1{margin-bottom: 2px; color: var(--cinza06); font-weight: 400;}
							.encontreAquiItensFlex2 div{font-size: 14px; color: var(--cinza04); margin-top: 3px; font-style: italic;}
							.encontreVejaMais{position: relative; margin-left: 10px; width: 490px; padding: 8px 0; font-size: 14px; font-weight: 400; text-align: center; background: url("../imgSite/bgLista.webp"),var(--cinza01); color: var(--preto); border-radius: 5px 5px 0 0; cursor: pointer; border-bottom: 3px solid var(--roxo);}


						#empresas{position: relative; width: 330px;}

							.empresasMenu{float: left; width: 190px; margin: 10px 0px; border-right: 1px dotted var(--roxo);  overflow-y: auto; text-align: left;}
								.empresasMenu h1{margin: 0px; margin-top: 15px; color: var(--roxo); font-weight: 500; cursor: pointer;}
									.empresaSubMenu{display: none; margin: 5px 0px; padding-left: 5px; font-size: 14px;}

							.empresasResultado{overflow: hidden; padding-top: 10px; text-align: left; color: var(--preto);}
								.empresasResultadoTitulo{margin: 0px; padding: 5px 10px; color: var(--roxo); font-size: 22px; font-weight: 600; letter-spacing: 1px; background: url("../imgSite/bgLista.webp"),var(--cinza01); border-radius: 5px;}
								.empresasResultado b{margin: 0px; margin-top: 3px; color: var(--cinza06); font-size: 16px; font-weight: 400;}

								.empresaBox{margin-top: 10px; padding: 10px 0px; border-radius: 5px; cursor: pointer;}
								.empresaBox:hover{background: linear-gradient(to right, var(--roxo10),transparent); cursor: pointer;}
									.empresaBoxTitulo{margin: 0px; padding-left: 10px; font-size: 18px; color: var(--preto); border-radius: 5px;}
									.empresaBoxTitulo:hover{color: var(--roxo);}
									.empresasResultadoEndereco{color: var(--cinza06); line-height: 17px; font-size: 12px;}
									.empresasResultadoBairro{margin-left: 30px; color: var(--cinza06); line-height: 17px; font-size: 12px;}

									.empresaBtAcoesLista{position: absolute; animation-duration: 2s; left: 0px; top: 0px; width: 10px; height: 39px; background: var(--cinza04); border-radius: 0px 5px 5px 0px; border-left: 1px solid var(--cinza05)}
									.empresaBtAcoesListaShadow{box-shadow: 1px 0px 14px var(--roxo);}

									#empresaAjaxBox{position: relative; width: 300px; margin: 0 auto; padding: 10px; background: linear-gradient(to top, var(--roxo10),var(--branco),var(--branco)); color: var(--preto); overflow: hidden; border-radius:5px; border-bottom: 4px solid var(--cinza05);}
										.empAjaxImagem{width: 300px; height: 158px; margin-bottom: 10px; border-bottom: 2px solid var(--roxo); border-radius: 5px;}
										.empAjaxTitulo{font-size: 20px; font-weight: 500; color: var(--roxo); }
										.empAjaxBoxBt{display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between;}

										.empAjaxBoxInfo{position: relative; padding-bottom: 7px;}
											.empAjaxEndereco{position: relative; padding-left: 65px; width: 230px; height: 47px; text-align: left; text-wrap: nowrap; font-size: 14px; overflow: hidden;}
											.empAjaxEndereco{background: url('../imgSite/ico_location_navigation.png'); background-repeat: no-repeat; background-position: 0px -10px;}

											.empresaBtAcoesListaMapa{padding:5px; margin: 0px 5px; background: var(--roxo); border-radius: 10px;}
												.empresaBtAcoesListaMapa a{color: var(--branco); font-size: 14px; font-weight: 500;}

				#homeLateralDireita1{position: relative; top: 0px; right: 10px; width: 479px; border-left: 1px dotted var(--roxo);}

					#artistas{display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-around; height: 113px; padding-bottom: 10px; border-bottom: 1px dotted var(--roxo);}
						.artistaInfo{width: 83px; overflow: hidden; cursor: pointer;}
						.artistaInfo:hover{color: var(--roxo);}
							.artistaInfoImg{width: 78px; height: 78px; border-radius: 50%; border-bottom: 2px solid var(--roxo);}
							.artistaInfoTitulo{text-align: center; text-transform: uppercase; margin-top: 3px; font-size: 12px;}

								#artistasAjaxBox{width: 320px; margin: 0 auto; padding: 5px; padding-bottom: 10px; color: var(--preto); overflow: hidden; border-radius: 5px; border-bottom: 4px solid var(--cinza05);}
									.artistasAjaxBoxDados{width: 320px; margin-top: 10px; overflow: hidden; text-align: left; border-bottom: 2px solid var(--cinza02); border-radius: 5px 0 5px 5px; }
									.artistasAjaxBoxDados i{font-size: 13px; color: var(--cinza04);}
									.artistasAjaxBoxImg{margin-right: 10px;}
									.artistasAjaxBoxTitulo1{font-size: 22px; color: var(--roxo);}
									.artistasAjaxBoxTitulo2{font-size: 18px; color: var(--cinza06); margin: 0px; margin-top: 5px;}
									.artistasAjaxBoxSubTitulo1{font-size: 16px; color: var(--cinza05); margin: 0px;}

								#artistaAjaxBox{width: 320px; margin: 0 auto; padding: 5px; padding-bottom: 10px; color: var(--preto); overflow: hidden; border-radius: 5px; border-bottom: 4px solid var(--cinza05);}
									.artistaAjaxImagem{width: 180px; height: 180px; margin: 0 auto; margin-bottom: 10px; background-repeat: no-repeat; background-size: contain; border-bottom: 2px solid var(--roxo); border-radius: 50%;}
									.artistaAjaxTipo{margin-bottom: 3px; font-size: 14px; color: var(--roxo); text-transform: uppercase;}
									.artistaAjaxTitulo{font-size: 25px; color: var(--roxo);}
									.artistaAjaxTexto{margin: 0px 10px; font-size: 14px; text-align: justify; color: var(--cinza05);}
									.artistaAjaxBoxPlayer{margin: 10px 0px; margin-top: 20px;}

									.artistaAjaxBoxFotos{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: center;}
										.artistaAjaxFoto{min-width: 150px; height: 150px; margin: 5px; opacity: 0.7; background: var(--roxo10); border-radius: 5px; cursor: pointer; border-top: 2px solid var(--roxo); border-bottom: 2px solid var(--roxo); }
										.artistaAjaxFoto:hover{opacity: 1;}

										.artistaAjaxBtInsta{letter-spacing: 2px; margin-top: 10px; font-size: 13px; text-transform: uppercase;}
										.artistaAjaxBtInsta:hover{color: var(--roxo);}

					#eventos{position: relative; width: 479px; overflow: hidden;}
						.eventosFlex{overflow: hidden; display: flex; flex-direction: row; flex-wrap: nowrap; width: 465px; margin-left: 10px; margin-bottom: 10px; border-radius: 0 0 5px 5px; border-bottom: 2px solid var(--cinza02); background: linear-gradient(to right, var(--cinza01),var(--branco)); cursor: pointer;}
							.eventosItensFlex1{width: 150px; height: 76px; border-radius: 5px 0 0 5px; background: var(--roxo); border-bottom: 1px solid var(--cinza03); cursor: pointer;}
							.eventosItensFlex2{width: 300px; height: 67px; padding: 5px; padding-left: 10px; text-align: left; color: var(--preto); cursor: pointer;}
							.eventosItensFlex2:hover{background: linear-gradient(to right, var(--roxo10),var(--branco)); color: var(--roxo) !important;}
								.eventosItensFlex2 i{font-size: 12px; color: var(--cinza05);}
								.eventosItensFlex2Titulo{font-size: 16px; margin: 0px; color: var(--cinza06); font-weight: 400;}
								.eventosItensFlex2Endereco1{font-size: 13px; color: var(--cinza04); text-transform: uppercase;}
								.eventosMsgOff{color: var(--cinza04); padding: 10px; text-align: center; align-items: center;}
								.eventosVejaMais{position: relative; width: 468px; margin-left: 10px !important; padding: 8px 0; font-size: 14px; font-weight: 400; text-align: center; background: url("../imgSite/bgLista.webp"),var(--cinza01); color: var(--preto); border-radius: 5px 5px 0 0; cursor: pointer; border-bottom: 3px solid var(--roxo);}


					#boxEventos{width: 330px; margin-top: 40px;  cursor: pointer; color: var(--preto);}
						.boxEventosTitulo{color: var(--roxo); text-align: left; margin-top: 2px; font-size: 24px; font-weight: 500;}

							.boxEventosLista{display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between}
								.boxEvento{position: relative; width: 160px; margin: 10px 0;}
									.boxEventoImg{width: 100%; height: 80px;}
									.boxEventoData{margin-top: 3px; font-size: 12px; text-align: center; color: var(--cinza05);}
									.boxEventoTitulo{color: var(--cinza05); text-align: center; margin: 0px; font-size: 15px; font-weight: 500; letter-spacing: 0; cursor: pointer;}

					#evento{margin-bottom: 20px;}
						.eventoImagem{width: 360px; height: 165px; float: left; border-radius: 5px; border-bottom: 2px solid var(--roxo); cursor: pointer;}

						.eventoFlex{display: flex; flex-direction: row; flex-wrap: wrap;  padding: 5px; border-bottom: 4px solid var(--cinza05); border-radius: 5px;}
							.eventoFlexDados{width: 100%; color: var(--preto);}
								.eventoAbertoTitulo{display: inline-block; color: var(--roxo); margin-top: 10px; font-size: 22px;}
								.eventoAbertoData{font-size: 18px;}
								.eventoAbertoEndereco{font-size: 16px; text-align: center;}
								.eventoAbertoTexto{ padding: 10px; text-align: left; overflow: hidden;}

							#listaEventosBox{margin-bottom: 20px;}
								.listaEventosBoxAbreLista{margin-top: 20px; padding: 5px; background: var(--roxo); border-radius: 5px; cursor: pointer;}
									.eventoAbertoListaDados{margin-bottom: 10px; display: flex; align-items: flex-start; height: 53px;}
										.eventoAbertoListaData{margin-top: 10px; padding: 5px; color: var(--cinza04); text-align: left; text-transform: uppercase; font-size: 12px; font-weight: 500;}
										.eventoAbertoBolinha{display: inline-block; height: 7px; width: 7px; margin-right: 4px; border-radius: 50%; background: var(--roxo);}
										.eventoAbertoListaTitulo{color: var(--roxo); font-size: 14px; font-weight: 500; text-align: left;}
										.eventoAbertoListaCidade{font-size: 12px; text-align: left; color: var(--cinza04); text-transform: uppercase;}
										.eventoAbertoListaImagem{margin-right: 5px; margin-bottom: 5px; width: 100px; height: 53px; margin-right: 5px; border-radius: 5px 0 0 5px;}

								.eventoMaisInfo{display: flex; justify-content: space-between; margin: 13px 0px; padding: 5px; background: url(../imgSite/bgLista.webp), var(--cinza01); border-bottom: 1px solid var(--roxo); border-radius: 5px; box-shadow: rgba(97, 48, 134, 0.40) 0px 3px 8px 0px;}
									.eventoMaisInfoBt{min-width: 100px; padding: 5px; text-align: center; font-size: 14px; font-weight: 500; border-radius: 5px; cursor: pointer;}
										.eventoMaisInfoBt a{font-size: 14px; font-weight: 500; color: var(--preto);}
										.eventoMaisInfoIco{margin-bottom: -5px;}

							#eventosPrint{position: relative; margin: 0 auto; width: 1080px; height: 1920px; background: linear-gradient(to top, var(--roxo10),var(--branco),var(--roxo10));}
								#eventosPrintBox{padding: 50px; padding-top: 200px; display: flex; flex-direction: row; flex-wrap: wrap; justify-content: center; border-radius: 10px;}
									.eventoPrintLogo{width: 400px; margin: 30px auto;}
									.eventoPrintTitulo{padding-top: 80px; color: var(--roxo); text-align: center; font-size: 60px; text-shadow: 0px 0px 80px var(--roxo);}
										.eventoPrintDados{width: 318px; height: 230px; margin: 4px; margin-bottom: 20px;}
											.eventoPrintDadosImg{width: 100%; height: 170px;}
											.eventoPrintDadosTitulo{color: var(--roxo); font-size: 26px; height: 30px; overflow: hidden;}
											.eventoPrintDadosData{color: var(--cinza05); font-size: 28px;}
											.eventoPrintDadosEndereco{color: var(--cinza05); font-size: 20px;}

			.buscaBoxPesquisa{position: relative; height: 43px; overflow:hidden; margin-top: 5px;}
			.buscaBoxPesquisaDetalhe{position: absolute; animation-duration: 2s; left: -327px; top: 0px; width: 330px; height: 43px; background: var(--cinza04); border-radius: 0px 5px 5px 0px; border-left: 1px solid var(--cinza05); box-shadow: 1px 0px 14px var(--roxo);}

			#loading-screen{position: fixed; width: 100%; height: 100%; left: 0px; top: 0px; background-color: #fff; display: flex; justify-content: center; align-items: center; z-index: 9999; cursor: url('../imgSite/ufo_05.png?as'), auto;}
			#loading-logo {width: 250px; animation: upDown 1s linear infinite;}
			@keyframes spin {
			  from { transform: rotate(0deg); }
			  to { transform: rotate(0deg); }
			}
			@keyframes upDown {
		    0% {
	        transform: translateY(0px);
		    }
		    10% {
	        transform: translateY(10px);
		    }
		    20% {
	        transform: translateY(0px);
		    }
		    30% {
	        transform: translateY(5px);
		    }
		    40% {
	        transform: translateY(0px);
		    }
		    100% {
	        transform: translateY(0px);
		    }
			}



#admBox{position: relative; width: var(--browserWeb1); padding: 10px 0px; text-align: center;}

#admBox h1{padding-top: 10px; padding-left: 10px; color: var(--roxo); font-size: 16px; text-align: left !important;}

.listaConteudo{font-size: 14px; text-align: left; background: var(--cinza01); padding: 3px; margin: 3px; margin-bottom: 10px;}
	.listaConteudo i{font-size: 12px;}
	.listaConteudoTitulo{font-weight: 500;}

.identacao1{font-size: 14px; text-align: left; background: var(--cinza02); padding: 3px; margin: 3px; margin-bottom: 10px; display: flex; flex-direction: row; flex-wrap: nowrap;}
.identacao2{font-size: 13px; text-align: left; background: var(--cinza01); padding: 3px; margin: 3px; margin-bottom: 10px; display: flex; flex-direction: row; flex-wrap: nowrap;}}
.identacao3{font-size: 12px; text-align: left; background: var(--branco); padding: 3px; margin: 3px; margin-bottom: 10px; display: flex; flex-direction: row; flex-wrap: nowrap;}}

.form{position: relative; min-height: 200px; width: 360px; margin: 0 auto;}
	.formItens{padding: 3px; margin-bottom: 5px;}
		.formDescricao{text-align: left; background: var(--cinza01); padding: 3px; text-transform: uppercase; font-weight: 500; font-size: 14px;}
		.formComponente{text-align: left; background: var(--cinza02); padding: 3px; text-align: center;}
			.formComponente input[type="password"]{background: #fff; margin: 0px; width: 97%; font-size: 14px; font-weight: 500;}
			.formComponente input[type="text"]{background: #fff; margin: 0px; width: 97%; font-size: 14px; font-weight: 500;}
			.formComponente input[type="number"]{background: #fff; margin: 0px; width: 97%; font-size: 14px; font-weight: 500;}
			.formComponente input[type="datetime-local"]{background: #fff; margin: 0px; width: 97%; font-size: 14px; font-weight: 500;}
			.formComponente input[type="date"]{background: #fff; margin: 0px; width: 97%; font-size: 14px; font-weight: 500;}
			.formComponente input[type="submit"]{background: #fff; margin: 0px; width: 33%; text-transform: uppercase; font-weight: 500; font-size: 14px;}
			.formComponente select{background: #fff; margin: 0px; width: 100%; font-size: 14px; font-weight: 500;}
			.formComponente textarea{background: #fff; margin: 0px; width: 100%; font-size: 14px; font-weight: 500;}

.icoAdm{width: 110px;}
	.icoAdm li{margin-right: 10px; display: inline-block;}
		.icoAdm li:last-child{margin-right: unset;}
	.icoAdm img{width: 20px;}

.btVoltar{position: absolute; top: 5px; left: 5px;}
.btAdicionar{position: absolute; top: 5px; right: 5px;}


.starVerde {
    position: absolute;
    width: 6px;
    height: 6px;
    background-color: var(--verde);
    border-radius: 50%;
    animation: caiEstrela 2s linear forwards;
		z-index: 911;
}
.starVermelho {
    position: absolute;
    width: 6px;
    height: 6px;
    background-color: var(--vermelho);
    border-radius: 50%;
    animation: caiEstrela 2s linear forwards;
		z-index: 911;
}
@keyframes caiEstrela {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(200px);
    }
}




.clear{clear: both;}
.textShadow{text-shadow: 0px 0px 10px white;}
.textShadowPreto{text-shadow: 0px 0px 4px black;}
.boxShadow{box-shadow: rgba(0, 0, 0, 0.40) 0px 0px 5px 1px;}
.dropShadow{-webkit-filter: drop-shadow(0px 0px 21px var(--branco)); filter: drop-shadow(0px 0px 20px var(--branco));}
.blur4{filter: blur(4px);}
.opacity7{opacity: 0.7;}
.txtDegrade{background-image: linear-gradient(79deg, #2b0aff, #ff5b8a 49%, #ff5b8a 55%, #fba64b 77%, #f99b52); background-clip: text;}

.fontVermelho{color: var(--vermelho) !important;}
.fontVerde{color: var(--verde) !important;}
.fontRoxo{color: var(--roxo) !important;}

.fontColor{animation: colorFont 3s infinite;}
@keyframes colorFont {
	0%, 100%  {color: #fff;}
	25% {color: #ffd800;}
	50% {color: #fff;}
	75% {color: #ffd800;}
}
.fontColor2{animation: colorFont2 3s infinite;}
@keyframes colorFont2 {
	0%, 100%  {color: #000;}
	25% {color: #8400b5;}
	50% {color: #000;}
	75% {color: #8400b5;}
}
.fontColorVerde{animation: colorFontVerde 3s infinite;}
@keyframes colorFontVerde {
	0%, 100%  {color: #000;}
	25% {color: #24ff00;}
	50% {color: #000;}
	75% {color: #24ff00;}
}
.fontColorLocationVermelho{animation: fontColorLocationVermelho 3s infinite; cursor: pointer;}
@keyframes fontColorLocationVermelho {
	0%, 100%  {color: #bd2a2a;}
	25% {color: #000;}
	50% {color: #bd2a2a;}
	75% {color: #000;}
}

.bgColorOn{animation: bgColorOn 500ms;}
@keyframes bgColorOn {
	0%, 100%  {background: var(--roxo);}
	50% {background: var(--verde);}
}

.bgColorOff{animation: bgColorOff 500ms;}
@keyframes bgColorOff {
	0%, 100%  {background: var(--roxo);}
	50% {background: var(--vermelho);}
}

::selection{background: var(--roxo); -webkit-text-fill-color: var(--branco);}

:root
{
	--browserWeb1: 1000px;

	--branco: #ffffff;
	--branco90: rgba(255,255,255,0.9);

	--preto: #000000;
	--preto90: rgba(0,0,0,0.9);
	--preto50: rgba(0,0,0,0.5);

	--roxo: #8400b5;
	--roxo10: #8400b510;
	--roxo20: #8400b520;
	--roxo30: #8400b530;
	--roxo50: #8400b550;
	--roxo70: #8400b570;

	--azul: #003265;
	--azul50: #00326550;
	--azul10: #00326510;

	--vermelho: #bd2a2a;
	--vermelho10: #bd2a2a10;
	--vermelho70: #bd2a2a70;

	--verde: #00ff18;
	--verde10: #00ff1810;
	--verdeZap: #00a884;

	--amarelo: #ffd800;
	--amarelo10: #ffd80010;
	--amarelo70: #ffd80070;

	--cinza01: #f1f1f1;
	--cinza02: #e4e4e4;
	--cinza03: #999999;
	--cinza04: #666666;
	--cinza05: #333333;

	--msgAlert1: #baefa7;
	--msgAlert2: #eeefa7;
	--msgAlert3: #a7b1ef;
	--msgAlert4: #efa7a7;
}
