.tcg-primary {
    background-color: #1b6869
}
.tcg-secondary {
    background-color: #2e3f3f;
}
.tcg-yellow {
    background-color: #fcc819;
}

.hero-content {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	text-align: center;
}
.hero-content h1 {
	font-size: 36px;
}
.hero-content i {
	font-size: 18px;
}

.hero-image {
	background-image: linear-gradient(rgb(0,0,0,0.5), rgba(0,0,0,0.5)), url('/images/tcg_0002.jpg');
	height: 500px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	text-align: center;
}

.alt-hero-image {
	background-image: linear-gradient(rgb(0,0,0,0.5), rgba(0,0,0,0.5)), url('/images/tcg_0005.jpg');
	height: 400px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	text-align: center;
}

.hero-image2 {
	background-image: linear-gradient(rgb(0,0,0,0.5), rgba(0,0,0,0.5)), url('/images/tcg_0001.jpg');
	height: 500px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	text-align: center;
}

.hero-image3 {
	background-image: linear-gradient(rgb(0,0,0,0.5), rgba(0,0,0,0.5)), url('/images/tcg_0004.jpg');
	height: 500px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	text-align: center;
}

.hero-image4 {
	background-image: linear-gradient(rgb(0,0,0,0.5), rgba(0,0,0,0.5)), url('/images/tcg_0003.jpg');
	height: 500px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	text-align: center;
}
.hero-image5 {
	background-image: linear-gradient(rgb(0,0,0,0.5), rgba(0,0,0,0.5)), url('/images/tcg_0006.jpg');
	height: 500px;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	position: relative;
	text-align: center;
}