/* ########## PARA VISUALIZAR UN EVENTO ########## */

/*Pone primera letra de un texto en mayúscula*/
.capitalize:first-letter{
	text-transform: uppercase;
}

/*Subtítulo para evento*/
.title{
	font-size: 3em !important;
}

/*Evita que dos componentes "label" de Bootstrap queden pegados*/
.label-spacing{
	margin-right: 1em;
}

/*Convierte las imagenes en responsivas dentro del contenido HTML del evento*/
p.html-container img{
	max-width: 100%;
	height: auto;
}
/*Convierte el texto a tamaño adecuado dentro del contenido HTML del evento*/
p.html-container p{
	font-size: 21px !important; /*Ignora otros estilos como los que usa el editor*/
}

/*Espaciado debajo del mapa para evitar que esté tan cerca de un título*/
.geocode-direction{
	margin-bottom: 25px;
}

/*Tamaño del mapa con id=map*/
#map {
	width: 100%;
	height: 200px;
}

/* ########## PARA USAR EN FORMULARIO ########## */

/*Vista previa de una imagen*/
img.preview{
	/*height: 120px;
	width: auto;*/
	width: 100%;
	height: auto;
}

/*Obliga a que un elemento "baje" de posición al hacer que ocupe todo el ancho para posicionarlo*/
.full-width{
	display: block;
	max-width: 100%;
}

/*Espacio para hacer "drag & drop" con imagen de evento*/
.drag-drop-area{
	border: 5px dashed #333; /*#F5F5F5*/
	color: #333; /*#F5F5F5*/
	/*width: 170px;*/
	width: 100%;
	text-align: center;
	padding: 50px 10px;
}

/*Espacio para botón y nombres de archivos subidos al servidor*/
.files-upload{
	margin-top: 0.5em;
}

/*Tamaño normal para componente "Labels" de Bootstrap*/
.label-lg{
	font-size: 100%;
}

/*Tamaño de los títulos de cada componente (por ejemplo <input>)*/
.format-title{
	font-size: 1.3em;
}

/* Animación solamente para algunos elementos que aparecen/desaparecen */
/* Cuando se esconde (mediante ng-show) */
/*.show-hide.ng-hide-add{
  animation:0.5s fadeOutUp linear;
}*/
/* Cuando se muestra (mediante ng-show) */
/*.show-hide.ng-hide-remove{
  animation:0.5s fadeIn linear;
}*/

/*Estilo a usar en dispositivos no-móviles (ancho > 768px)*/
@media (min-width: 768px) {
	/*Vista previa de una imagen*/
	img.preview{
		width: 50%;
		height: auto;
	}
}