.allcode_box{
	border-color: black;
	border-width: 0px;
	border-style: dotted;
	margin: 2px;
	font-family: Verdana, Geneva, Tahoma, sans-serif;
	font-size: 12px;
	line-height: 1.6;
	letter-spacing: 2px;
	text-align: left;
	border-radius: 10px;
	overflow: hidden; /*Le dice que le haga el contorno aunque no se vea y que nada se salga de su forma*/
	height: auto;/*Para no estar limitados de altura ponemos el height*/
}
/*Alinea el contenido al centro*/
.allcode_box.center{
	text-align: center;
	border-radius: 20px;
}

/*pequenya anchura*/
.allcode_box.l{
	max-width: 25%;
}

/*pequenya anchura*/
.allcode_box.x{
	max-width: 40%;
}

/*pequenya anchura*/
.allcode_box.xl{
	max-width: 60%;
}

/*Alinea el contenido al centro*/
.allcode_box.l{
	max-width: 25%;
}

/*color rojo*/
.allcode_box.danger > .allcode_boxTitle{
	background-color: rgb(218, 77, 77);
	color:rgb(255, 255, 255);
}

.allcode_box.danger > .allcode_boxContent{
	background-color: rgb(231, 94, 94);
	color:rgb(238, 236, 236);
}

/*color azul*/
.allcode_box.info > .allcode_boxTitle{
	background-color: rgb(77, 115, 218);
	color:rgb(255, 255, 255);
}

.allcode_box.info > .allcode_boxContent{
	background-color: rgb(82, 122, 233);
	color:rgb(238, 236, 236);
}

/*color verde*/
.allcode_box.ok > .allcode_boxTitle{
	background-color: rgb(147, 233, 35);
	color:rgb(255, 253, 253);
	text-shadow: 1px 1px rgb(0, 0, 0); 
}

.allcode_box.ok > .allcode_boxContent{
	background-color: rgb(154, 214, 75);
	color:rgb(255, 253, 253);
	text-shadow: 1px 1px rgb(0, 0, 0); 
}

/*Formato normal*/
.allcode_box > .allcode_boxTitle{
	background-color: rgb(236, 233, 233);
	color:black;
	padding: 8px;
	height: auto;/*Para no estar limitados de altura ponemos el height*/
	word-wrap: break-word;/*permite hacer un salto de linea y nos ahorra el overflow*/
}

.allcode_box > .allcode_boxContent{
	background-color: rgb(241, 240, 240);
	color:black;
	padding: 9px;
	height: auto;/*Para no estar limitados de altura ponemos el height*/
	word-wrap: break-word;/*permite hacer un salto de linea y nos ahorra el overflow*/
}

@media screen and (max-width: 600px) {
	.allcode_box.l , .allcode_box.x , .allcode_box.xl , .allcode_box{
		font-size: 14px;
		width: 99%;
		max-width: 99%;
	}
}

@media screen and (min-width: 1024px) {
	.allcode_box{
		font-size: 16px;
	}
}

@media screen and (min-width: 2048px) {
	.allcode_box{
		font-size: 18px;
	}
}

@media screen and (min-width: 3072px) {
	.allcode_box{
		font-size: 20px;
	}
}

@media screen and (min-width: 4128px) {
	.allcode_box{
		font-size: 22px;
	}
}