/*Header*/
	header{
		height: 60px;
		width: 100%;
		box-shadow: 0 5px 5px rgba(0, 0, 0, 10%); 
		background-color: white;
		font-size: 23px;
		display: flex;
		align-items: center;
		font-weight: 600;
		position: sticky;
		top: 0;
		z-index: 99;
	}
	header .fa-bars{
		padding: 0 20px;
		transition: all .3s ease;
	}
/*Menu*/
	#check:checked ~ .menu{
		left: 0;
	}
	#check:checked ~ .fonmenu{
		visibility: visible;
		opacity: 1
	}
	.menu{
		background-color: white;
		position: fixed;
		top: 60px;
		width: fit-content;
		z-index: 999;
		height: 100%;
		padding: 10px;
		left: -300px;
		transition: all .3s ease;
		font-size: 18px;
	}
	.fonmenu{
		height: 100%;
		width: 100%;
		position: fixed;
		top: 60px;
		background-color: rgba(0, 0, 0, 20%);
		backdrop-filter: blur(5px);
		visibility: hidden;
		opacity: 0;
		transition: all .3s ease;
		z-index: 99;
	}
	.menu .fa-code{
		margin-right: 5px;
	}
	.menu a{
		text-decoration: none;
		color: black;
		background-color: rgba(0, 0, 0, 10%);
		border-radius: 5px;
		padding: 5px 20px 5px 10px;
		display: block;
		margin-bottom: 7px;
		transition: all .3s ease;
	}
	.menu a:hover{
		padding: 5px 10px 5px 20px;
		background-color: rgba(0, 0, 0, 20%);
	}
/*Anuncios*/
	.anuncio{
		background-color: rgba(0, 0, 0, 20%);
		width: 100%;
		height: 300px;
		margin: 10px 0%;
		border-radius: 5px;
		overflow: hidden;
		position: relative;
	}
	.anuncio p{
		color: white;
		background-color: rgba(0, 0, 0, 50%);
		border-radius: 5px 0 5px 0;
		width: fit-content;
		padding: 5px;
		position: absolute;
		top: 0;
		left: 0;
	}
	.anuncioan{
		height: 90px;
		width: 100%;
		position: fixed;
		bottom: 0;
		background-color: white;
		box-shadow: 0 -5px 5px rgba(0, 0, 0, 10%);
		transition: all .3s ease;
		z-index: 9;
	}
	.close{
		position: absolute;
		top: -25px;
		right: 0;
		padding: 5px;
		background-color: white;
		box-shadow: -5px -5px 5px rgba(0, 0, 0, 10%);
		border-radius: 8px 0 0 0;
		font-size: 18px;
		border: 0;
	}
/*Contenido*/
	.atributos a{
		color: blue;
		border-bottom: 1px solid;
	}
	.box{
		background-color: white;
		width: 96%;
		margin: 10px 2%;
		padding: 15px;
		font-size: 20px;
		border-radius: 5px;
		color: black;
		font-weight: 600;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 10%);
	}
	.etiqueta{
		background-color: #f16528;
		color: white;
		border-radius: 5px;
		padding: 3px;
		margin-right: 5px;
		font-family: arial;
	}
	.indice{
		background-color: white;
		width: 96%;
		margin: 10px 2%;
		padding: 15px;
		font-size: 19px;
		border-radius: 5px;
		color: black;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 10%);
	}
	.indice a{
		background-color: rgba(0, 0, 0, 10%);
		border-radius: 5px;
		display: block;
		margin-bottom: 7px;
		padding: 3px;
		transition: all .3s ease;
	}
	.indice a:hover{
		padding: 3px 3px 3px 10px;
		background-color: rgba(0, 0, 0, 20%);
	}
	.descripcion{
		background-color: white;
		width: 96%;
		margin: 10px 2%;
		padding: 15px;
		font-size: 18px;
		border-radius: 5px;
		color: black;
		box-shadow: 0 2px 5px rgba(0, 0, 0, 10%);
	}
	.muestra{
		background-color: black;
		color: rgba(255, 255, 255, 40%);
		border-radius: 5px;
		padding: 8px;
		display: block;
		margin-top: 10px;
		width: 100%;
		overflow-x: scroll;
	}
	.muestra::-webkit-scrollbar{
		height: 7px;
		border-radius: 0 0 5px 5px;
	}
	.muestra::-webkit-scrollbar-thumb{
		background-color: rgba(255, 255, 255, 30%);
		border-radius: 5px;
	}
	.muestra::-webkit-scrollbar-thumb:hover{
		background-color: rgba(255, 255, 255, 50%);
	}
	.muestra p{
		color: rgba(255, 255, 255, 40%);
		width: 200%;
		margin-bottom: 5px;
	}
	.etiquetab{
		color: white;
	}
	.tabla{
		background-color: rgba(0, 0, 0, 10%);
		border-radius: 5px;
		margin-top: 25px;
	}
	.elemento{
		width: 100%;
		padding: 8px;
		border-bottom: 1px solid rgba(0, 0, 0, 20%);
	}
	.t1, .t2{
		width: 49%;
		display: inline-block;
		text-align: center;
		margin-bottom: 7px;
	}
	.resultado{
		background-color: rgba(0, 0, 0, 10%);
		color: black;
		border-radius: 5px;
		padding: 8px;
		display: block;
		margin-top: 10px;
		width: 100%;
		overflow: hidden;
	}
	.resultado h4{
		width: 100%;
		border-bottom: solid 1px;
		margin-bottom: 10px;
	}
	.boton{
		background-color: rgba(255, 255, 255, 1);
		border-radius: 5px;
		padding: 5px;

	}
	@media screen and (min-width: 1000px){
		.box{
			width: 70%;
			margin: 10px 15%;
		}
		.indice{
			width: 70%;
			margin: 10px 15%;
		}
		.descripcion{
			width: 70%;
			margin: 10px 15%;
		}
	}
/*General*/
	*{
		box-sizing: border-box;
		margin: 0;
		padding: 0;
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
	}
	a{
		text-decoration: none;
		color: black;
	}
	body{
		font-family: 'Outfit', arial;
		background-color: #F7F7F7;
		background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='400' height='400' viewBox='0 0 800 800'%3E%3Cg fill='none' stroke='%23F1D2D0' stroke-width='1'%3E%3Cpath d='M769 229L1037 260.9M927 880L731 737 520 660 309 538 40 599 295 764 126.5 879.5 40 599-197 493 102 382-31 229 126.5 79.5-69-63'/%3E%3Cpath d='M-31 229L237 261 390 382 603 493 308.5 537.5 101.5 381.5M370 905L295 764'/%3E%3Cpath d='M520 660L578 842 731 737 840 599 603 493 520 660 295 764 309 538 390 382 539 269 769 229 577.5 41.5 370 105 295 -36 126.5 79.5 237 261 102 382 40 599 -69 737 127 880'/%3E%3Cpath d='M520-140L578.5 42.5 731-63M603 493L539 269 237 261 370 105M902 382L539 269M390 382L102 382'/%3E%3Cpath d='M-222 42L126.5 79.5 370 105 539 269 577.5 41.5 927 80 769 229 902 382 603 493 731 737M295-36L577.5 41.5M578 842L295 764M40-201L127 80M102 382L-261 269'/%3E%3C/g%3E%3Cg fill='%23F1CAC3'%3E%3Ccircle cx='769' cy='229' r='5'/%3E%3Ccircle cx='539' cy='269' r='5'/%3E%3Ccircle cx='603' cy='493' r='5'/%3E%3Ccircle cx='731' cy='737' r='5'/%3E%3Ccircle cx='520' cy='660' r='5'/%3E%3Ccircle cx='309' cy='538' r='5'/%3E%3Ccircle cx='295' cy='764' r='5'/%3E%3Ccircle cx='40' cy='599' r='5'/%3E%3Ccircle cx='102' cy='382' r='5'/%3E%3Ccircle cx='127' cy='80' r='5'/%3E%3Ccircle cx='370' cy='105' r='5'/%3E%3Ccircle cx='578' cy='42' r='5'/%3E%3Ccircle cx='237' cy='261' r='5'/%3E%3Ccircle cx='390' cy='382' r='5'/%3E%3C/g%3E%3C/svg%3E");
	}
	textarea{
		width: 95%;
		margin: 2.5%;
		height: 100px;
	}
	#up{
		position: fixed;
		bottom: 150px;
		right: 10px;
		background-color: rgba(255, 255, 255, 1.0);
		box-shadow: 0 5px 5px rgba(0, 0, 0, 20%);
		padding: 10px;
		font-size: 25px;
		border-radius: 5px;
	}