@font-face{
   font-family: FlamaCondensed-bold;
   src: url('../../shared/fonts/FlamaCondensed-Semibold.ttf');  
}
@font-face{
   font-family: FlamaCondensed;
   src: url('../../shared/fonts/FlamaCondensed-Book.ttf');  
}
@font-face{
   font-family: Helvetica;
   src: url('../../shared/fonts/Helvetica.ttf');  
}


.solo-pc { display: block !important; }
.solo-responsive { display: none !important; }

body {width: 99%; margin: 0px; background-color: #F7F7F7;}
strong{ font-weight: bold; }
#principal{ 
	max-width: 994px; 
	margin: auto; 
	padding: 10px; 
	text-align: center; 
	font-family: FlamaCondensed, Helvetica, Arial; 
}
#principal p, #principal a, #principal ul, #principal-pantallas p, #principal-pantallas a, #principal-pantallas ul {  }
#principal img { max-width: 100%; }

#cabecera img {width:100%;}

.solo-pc { display: block; }
.solo-responsive { display: none; }	

.anchor  { width: 0; height: 0; border: none; background-color: transparent; }

.without-padding { padding-left: 0 !important; padding-right: 0 !important; }	
.margin-top-30 { margin-top: 30px; }
.margin-top-50 { margin-top: 50px; }
.margin-top-100 { margin-top: 100px; }
.margin-bottom-0 { margin-bottom: 0px; }

/************** CABECERA ****************/
#cabecera{

}

.cabecera-titulo{
	font-family: FlamaCondensed-bold;
    font-size: 32px;
    line-height: 1.1;
    letter-spacing: 1px;
    color: #ec534b; /*rojo*/
    margin: 30px auto 0 auto;
    width: 90%;
}

.cabecera-texto{
	width: 70%;
	color: #1a1a1a; /*negro*/
	margin: auto;
	font-size: 25px;
}

/*************** TIENDAS **************/
.tabla-tiendas{
	background-color: #ffff;
	background: url('./realdates/img/fondo_mensajes.jpg');
	padding: 25px 25px 50px;
}

.item-tiendas{
	margin: 15px 0;
}

/*************** VIP **************/
.p-vip{
	font-family: FlamaCondensed-bold;
    font-size: 32px;
    line-height: 1.1;
    letter-spacing: 1px;
	color: #ec534b; /*rojo*/
}

.p-vip a{
	color: #ec534b; /*rojo*/
	text-decoration: underline;
}

.p-vip a:hover{
	text-decoration: none;
}

/******************************************************************/	
/*******************con efecto chachi******************************/	
/******************************************************************/	
.hovereffect {
	width: 100%;
	float: left;
	overflow: hidden;
	position: relative;
	text-align: center;
	cursor: default;
}
.hovereffect .overlay {
	width: 100%;
	position: absolute;
	overflow: hidden;
	top: 0;
	left: 0;
	opacity: 0;
	-webkit-transition: all .4s ease-in-out;
	transition: all .4s ease-in-out;
}
.hovereffect img {
	display: block;
	position: relative;
	margin: 0 auto; /* Caso de que en responsive sólo haya un elemento por fila */
	-webkit-transition: all .4s linear;
	transition: all .4s linear;
}
.hovereffect h6 {
	color: #fff;
	text-align: center;
	position: relative;
	font-size: 17px;
	-webkit-transform: translatey(-100px);
	-ms-transform: translatey(-100px);
	transform: translatey(-100px);
	-webkit-transition: all .2s ease-in-out;
	transition: all .2s ease-in-out;
}

.hovereffect:hover .overlay {
	opacity: 1;
	filter: alpha(opacity=100);
}
.hovereffect:hover h6 {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-transform: translatey(0);
	-webkit-transform: translatey(0);
	transform: translatey(0);
	/*margin-top: -1px;*/
}

/******************************************************************/	
/******************************************************************/



/********************************************************************************/
/********************************** RESPONSIVE **********************************/
/********************************************************************************/

@media screen and (max-width: 767px) {
	.solo-pc { display: none !important; }
	.solo-responsive { display: block !important; }	

}

@media screen and (max-width: 380px) {
	
}
