html {
	background-image: linear-gradient(to left, #fff311, #ff1129);

	color: #ffffff;
	font-family: Helvetica, Arial, sans-serif;
}

body {

	min-height: calc(100vh - 3vmin);
	max-width: calc(100vw - 3vmin);

	margin-left: 0;
	margin-top: 0;
	margin-bottom: 1vmin;
	margin-right: 1vmin;

	background-color: #222222;
	border-bottom-right-radius: 15vmin;

	display: flex;
	flex-direction: column;
	justify-content: flex-end;

	padding: 1vmin;
	position: relative;
}

div.linkBox {

	display: block;
	float: left;
}

div.linkBox:hover {
        background-color: #444444;
}

div.linkBoxContainer {
	height: 100%;
        width: 100%;
        overflow: hidden;
        vertical-align: bottom;
        text-align:center;

        font-weight: bold;
        font-size: 5vmin;
}

div.linkBoxContainer * {
        margin: auto;
        vertical-align: middle;

        max-width: 100%;
        max-height: 100%;
}

div.textBox {

	text-align: center;
        font-size: 2vh;
        font-weight: bold;

        display: table-cell;
	float: left;
        position: relative;
	padding: 2vmin;

        width: 100%;
}

div#header {
	font-weight: bold;

	text-align: center;
	vertical-align: middle;
}

div#content {
	flex-grow: 1;

	text-align: center;
}

div#contentArea {
	margin: auto;
	display: flex;
	flex-wrap: wrap;
}

div#footer {
	font-size: 2vh;
	font-weight: bold;

	text-align: center;
}

p.text-in-background-color {
	background-image: linear-gradient(to left, #fff311, #ff1129);
        -webkit-text-fill-color: transparent;
        -webkit-background-clip: text;
}

a {
	color: #fff311;
	text-decoration: none;
}

a:hover {
	color: #ff1129;
}

p {
	margin: 1vh 0;
}

p.quote {
	background-color: #333333;

	color: #cccccc;
	overflow-wrap: anywhere;
	text-align: left;

	box-sizing: border-box;
	display: block;
	margin: 1vh auto;
	max-width: 100%;
	padding: 1vh;
	width: max-content;
}

