.FactionContainer
{
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	align-items: center;
	width: 100%;
	min-height: 400px;
	height: 400px;
	background-color: rgb(40, 40, 40);
	box-shadow: inset 0px 0px 15px rgba(0,0,0,0.5);
	font-family: 'Poppins', sans-serif;
}

.FactionContainer p
{
	width: calc(100% - 2rem);
	padding: 0rem 1rem;
	color: white;
	position: absolute;
	font-size: 1rem;
	text-shadow: 2px 2px 5px #000000;
}

.WorkFaction
{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	width: 49%;
	height: 95%;
	text-align: center;
	background-image: url(../Sources/ChooseFaction/Workers/img0.png);
	background-size: auto 100%;
	background-position: center;
	border: 1px solid red;

	transition-duration: 0.2s;
	transition-property: background-size;
	transition-timing-function: ease-in;
}

.WorkFaction:hover
{
	cursor: pointer;
	background-size: auto 120%;
}

.WorkFaction::before
{
	content: '';
	position: relative;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: 20%;

	transition-duration: 0.2s;
	transition-property: opacity;
	transition-timing-function: ease-in;
}

.WorkFaction:hover::before
{
	opacity: 70%;
}

.MafiaFaction
{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	width: 49%;
	height: 95%;
	text-align: center;
	background-image: url(../Sources/ChooseFaction/Mafia/img0.png);
	background-size: auto 100%;
	background-position: center;
	border: 1px solid red;

	transition-duration: 0.2s;
	transition-property: background-size;
	transition-timing-function: ease-in;
}

.MafiaFaction:hover
{
	cursor: pointer;
	background-size: auto 120%;
}

.MafiaFaction::before
{
	content: '';
	position: relative;
	width: 100%;
	height: 100%;
	background-color: black;
	opacity: 20%;

	transition-duration: 0.2s;
	transition-property: opacity;
	transition-timing-function: ease-in;
}

.MafiaFaction:hover::before
{
	opacity: 70%;
}

@media screen and (max-width: 1460px)
{
	.FactionContainer p
	{
		font-size: 1.2rem;
	}
}

@media screen and (max-width: 1160px)
{
	/* Choose a faction */
	.FactionContainer
	{
		flex-direction: column;
		min-height: 800px;
		height: 800px;
	}

	.WorkFaction
	{
		width: 98%;
		height: 48%;
		background-image: url(../Sources/ChooseFaction/Workers/img1.png);
	}

	.MafiaFaction
	{
		width: 98%;
		height: 48%;
		background-image: url(../Sources/ChooseFaction/Mafia/img1.png);
	}
}