.event-grid-wrapper {
	overflow: hidden;

	.event-box {
		text-align: center;
		@include round-box-shadow(lighten($black, 75%), 15px, 0);

		img {
			display: inline-block;
		}
	}

	.event-box .event-details {
		padding: 28px 0 35px;

		.date {
			background-color: $theme-primary-color;
			font-size: 14px;
			font-weight: bold;
			color: $white;
			display: inline-block;
			padding: 0 10px;
			text-transform: uppercase;

			@include media-query(767px) {
				font-size: 12px;
				padding-top: 3px;
			}
		}

		h3 {
			font-size: 20px;
			margin: 0.9em 0 0.13em;
			text-transform: capitalize;

			@include media-query(767px) {
				font-size: 18px;
			}

			a {
				color: $heading-color;
			}

			a:hover {
				color: $theme-primary-color;
			}
		}

		.location {
			display: block;
			font-weight: bold;
			color: lighten($black, 65%);
			margin-bottom: 1.5em;
			text-transform: capitalize;

			@include media-query(767px) {
				font-size: 14px;
			}

			i {
				color: $theme-primary-color;
			}
		}

		.btn {
			font-size: 16px;
			font-weight: bold;
			color: $theme-primary-color;
			text-transform: capitalize;

			@include media-query(767px) {
				font-size: 15px;
			}

			&:hover {
				color: darken($theme-primary-color, 10%);
			}
		}
	}
}