body{
	font-family: "Arial", Helvetica, sans-serif;
	color:black;
}

.center{
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	margin-left: 40px;
}

h1{
	font-size:20px;
}

h1 p{
	background:#222;
	color:#fff;
}

.clear{clear:both;}

.tit{
	margin-left: -51px;
}
.title-skills{
	font-size: 40px;
	font-weight: bold;
	text-transform: uppercase;
}
.p-pro{
	font-weight: bold;
	color: #222;
}

progress[value] {
	/* Elimino la apariencia por defecto */
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	
	/* Quito el borde que aparece en Firefox */
	border: none;

	/* A�ado mis propios estilos */
	width: 198px;
	height: 20px;
	
	
/* 	Estos estilos solo se aplicaran al fondo de la barra en mozilla */
	overflow:hidden;
	background-color:black;
	border-radius : 20px ; 
}

.pro{
	float:left;
	margin-right:11px;
	margin-bottom:20px;
}

.pro span{
	font-weight:bold;
	color: #222;
}

/* Compatibilidad de color en Firefox, Chrome y Safari */
progress::-moz-progress-bar{ 
	background: #00c6ff; /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #00c6ff, #0072ff); /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #00c6ff, #0072ff); 
	border-radius : 20px ; 
	} 
progress::-webkit-progress-value { 
	background: #00c6ff; /* fallback for old browsers */
	background: -webkit-linear-gradient(to right, #00c6ff, #0072ff); /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(to right, #00c6ff, #0072ff); 
	border-radius : 20px ; 	

}
progress::-webkit-progress-bar { 
	background-color:#D8D8D8;
	box-shadow: 0 2px 5px rgba(0, 0, 0, 0.25) inset;
	border-radius : 20px ; 
		
	
}