/*AppSocial*/
.btn_social { 

	width:100%; 
	float:left; 
	display:flex; 
	margin:auto; 
    padding: 0;
}

.btn_social ul  { 

	width:auto; 
	margin:auto; 
	float:left; 
	display:block; 
	margin-top: 10px;
}

.btn_social ul li  { 

	position:relative; 
	background:#28282a; 
	list-style:none; 
	float:left; 
	margin:5px; 
	z-index:1; 
	overflow:hidden; 
	border-radius:3px; 
	font-size:1.5em; 
	text-align:center; 
}

.btn_social ul li a  { 

	width:48px; 
	height:48px; 
	line-height:51px; 
	display:block; 
	text-decoration:none; 
	color:#d7c9fd; 
	transition:.4s;

}

.btn_social ul li::before { 

	transition:0.4s; 
	position:absolute; 
	content:''; 
	width:100%; 
	height:100%; 
	top:90%; 
	left:0; 
	background:#5a20f8; 
	z-index:-1; 
	transform: scale(1); 
	transition:.4s; 
}

.btn_social ul li:hover::before { transition:0.4s; top:0%; }
.btn_social ul li a:hover       { color:#030303; }
/*App Social*/

/* ========== INICIO BREAKPOINTS ========== */


@media only screen and (min-width: 1px) and (max-width: 200px)  {

.btn_social ul  { 
	margin-top: 5px;
}

.btn_social ul li  { 
	margin:2px; 
	border-radius:3px; 
	font-size: 9vw; 

}

.btn_social ul li a  { 

	width:13vw; 
	height:13vw; 
	line-height:15vw; 

}

}



@media only screen and (min-width: 201px) and (max-width: 294px)  {

.btn_social ul  { 
	margin-top: 5px;
}

.btn_social ul li  { 
	margin:3px; 
	border-radius:3px; 
	font-size: 9vw; 

}

.btn_social ul li a  { 

	width:13vw; 
	height:13vw; 
	line-height:15vw; 

}

}

/* ========== SMALL DEVICES ========== */
@media only screen and (min-width: 295px) and (max-width: 350px)  {

	.btn_social ul  { 
	margin-top: 5px;
}

.btn_social ul li  { 
	margin:4px; 
	border-radius:3px; 
	font-size: 9vw; 

}

.btn_social ul li a  { 

	width:13vw; 
	height:13vw; 
	line-height:15vw; 

}

}

/* ========== LARGE DEVICES ========== */
@media only screen and (min-width: 841px) and (max-width: 960px) {
	
	
}

/* ========== FULL DEVICES ========== */
@media only screen and (min-width: 981px) {

	

}