#ticketContainer {
	text-align: center;
	clear: both;
	margin-bottom: 10px;
}

.ticket {
	position: relative;
	display: inline-block;
	width: 98%;
	margin-left: 3px;
	margin-right: 9px;
	margin-top: 3px;
	margin-bottom: 9px;
}

.ticketImg {
	margin: 10px auto 0 auto;
	width: auto;
	height: auto;
	overflow: hidden;
}

.ticketImg img {
	max-width: 300px;
	max-height: 200px;
}

.ticketDescription {
	font-weight: bold;
	font-size: 110%;
	margin: 10px 0;
	height: auto;
	margin-bottom: 10px;
}

.ticketDate {
	margin: 10px;
	font-weight: bold;
}

.ticketLocation {
	margin: 10px;
	height: auto;
}

.ticketSocialNetworking {
	width: 100px;
	text-align: left;
	padding: 5px 0 10px 15px;
	float: left;
	margin-top: -25px;
}

.ticketBuyButton {
	padding: 0 10px 10px 0;
	float: right;
	margin-top: -25px;
}

.ticketPriceRange {
	margin: 5px;
	font-weight: bold;
	font-size: 120%;
	height: 20px;
}

@media(min-width:768px) {
/*
	.ticket {
		width: 260px;
		margin-right: 10px;
		margin-bottom: 10px;
	}
*/
	.ticketImg {
		width: 200px;
		height: 200px;
	}

	.ticketDescription {
		height: 40px;
	}

	.ticketLocation {
		height: 55px;
	}

	.ticketSocialNetworking {
		padding: 15px 0 15px 15px;
		margin-top: 0;
	}

	.ticketBuyButton {
		padding: 5px 15px 15px 0;
		margin-top: 0;
	}

}

/* 10/20/2016, bbale - KOSTIZI-1924 - tweaking ticket width behavior.
	This number was chosen as the cutoff because, when on mobile devices,
	we weant the event to take up the full width of the screen.
	On desktop devices, we can fit 2 of them side-by-side (with the sidebar menu). */
@media(min-width:768px) {
	.ticket {
		width: 47.5%;
		display: block;
		float: left;
	}
}

/* This is the width at which 3 will fit across (with the sidebar menu) */
@media(min-width:1080px) {
	.ticket {
		width: 31.5%;
		display: block;
		float: left;
	}
}

/* This is the width at which 4 will fit across (with the sidebar menu) */
@media(min-width:1370px) {
	.ticket {
		width: 23.5%;
		display: block;
		float: left;
	}
}