.TripleWide {}
.TripleWide .col {
	width: 33.33%;
	border: 1px solid #fff;
	border-right: 0px;
	overflow: hidden;
	position: relative;
}
.TripleWide a:hover {
	text-decoration: none;
}
.TripleWide a {
	color: inherit;
	text-transform: uppercase;
	position: relative;
	display: block;
}
.TripleWide img {
	width: 100%;
	display: block;
}
.TripleWide .col .linktext {
	width: 100%;
	bottom: 0px;
	left: 0px;
	background-color: rgba(8,72,96,.85);
	border-top: 1px solid #fff;
	color: #fff;
	text-align: center;
	text-transform: uppercase;
	font-size: 28px;
	font-weight: 700;
	padding: 10px;
	position: absolute;
}
.TripleWide .col:hover .linktext {
	background-color: rgba(79,161,192,.85);
	text-decoration: none;
}

/* COLORFUL BLOCK */
	.ColorfulBlock {}
	.ColorfulBlock .flex-left {
		max-width:60%;
		flex: 1;
		border-right:1px solid #fff;
	}
	.ColorfulBlock .flex-right {
		max-width:40%;
		flex: 1;
	}
	.ColorfulBlock a {
		color:#fff;
	}
	.ColorfulBlock a:hover {
		color:#fff;
	}
	.ColorfulBlock .content {
		color:#fff;
		padding:20px;
	}
	.ColorfulBlock .title {
		color:#fff;
		font-size:26px;
		font-weight:700;
		margin-bottom:15px;
	}
	.ColorfulBlock .title i {
		color:#fff;
		font-size:34px;
	}
	.ColorfulBlock .block1 .content {
		max-width:850px;
		float:right;
	}
	.ColorfulBlock .flex-right .content {
		max-width:590px;
	}
	.ColorfulBlock .flex-right .content p{
		margin-bottom:10px;
	}
	.ColorfulBlock .flex-right .block2 {
		height:50%;
		flex: 1;
		border-bottom:1px solid #fff;
	}
	.ColorfulBlock .flex-right .block3 {
		height:50%;
		flex: 1;
	}
	.ColorfulBlock .button {
		display: block;
		max-width: 250px;
		text-align: center;
	}
/* ^ COLORFUL BLOCK */
/* RANDOM TOP IMAGE */
	.RandomTopImage {
		min-height: 400px;
		padding: 50px 0;
	}
	.RandomTopImage * {
		color: #fff;
	}
	.RandomTopImage.dark {
	}
	.RandomTopImage .container .clear {
		display: flex;
		flex-wrap: wrap;
	}
	.RandomTopImage .container .clear .right,
	.RandomTopImage .container .clear .left {
		float: none;
	}
/* ^ RANDOME TOP IMAGE */

/*  UPCOMING EVENT */
	.upcomingDate {
		font-weight: bold;
		margin-bottom: 10px;
	}
	.upcomingName {
		margin-bottom: 10px;
	}
/* ^ UPCOMING EVENT */
@media (max-width:1200px) {
	.RandomTopImage {
		min-height: 350px;
	}
}
@media (max-width:1000px) {
	.RandomTopImage {
		min-height: 300px;
	}
	.ColorfulBlock .flex-right,
	.ColorfulBlock .flex-left,
	.TripleWide .col {
		width: 100% !important;
		max-width: 100% !important;
		margin: 0;
	}
}
