@import url('https://fonts.googleapis.com/css?family=Bangers|Cinzel:400,700,900&display=swap');
/* Used Google Fonts */

font-family: 'Cinzel', serif;


.logo {
    height: 100px;
    border-bottom: 2px solid #192841;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000033;
    width: 100%;
    margin: 0 auto;
    box-sizing: border-box;
}

.logo h3 {
    color: #e74c3c;
    font-family: 'Cinzel', serif;
    font-weight: 300;
    font-size: 30px;
    line-height: 1.3;
    padding-left: 30px;
}

.logo h3 span {
    background: #e74c3c;
    color: #fff;
    display: inline-block;
    line-height: 1.8;
    padding: 0 16px;
}

		body {
			background-color: #000033;
			margin: 0;
			padding: 0;
			font-family: 'Cinzel', serif;
			color: #fff;
		}

		header {
			height: 100px;
			border-bottom: 2px solid #192841;
			display: flex;
			align-items: left;
			justify-content: left;
		}

		.logo img {
			height: 60px;
		}

		main {
			padding: 20px;
			box-sizing: border-box;
			display: flex;
			flex-wrap: wrap;
		}

		.sub-section {
			background-color: #192841;
			border-radius: 10px;
			box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
			padding: 20px;
			box-sizing: border-box;
			margin: 10px;
			flex-basis: calc(50% - 20px);
			text-align: center;
		}

		.sub-section.full-width {
			flex-basis: 100%;
		}

		.sub-section h2 {
			margin-top: 0;
			text-shadow: 2px 2px 4px #000000;
		}
		.sub-section a,visited {
			color: #fff;
			text-decoration:none;
		}

		.floating-elements {
			display: inline-block;
			vertical-align: top;
			margin-right: 10px;
			margin-bottom: 10px;
			max-width: calc(33% - 10px);
			text-align: center;
		}

		.floating-elements h5 {
			text-decoration:underline;
			color: #e74c3c;
			font-size: 16px;
		}

		.button-box {
			background-color: #c0c0c0;
			border: 1px solid #c0c0c0;
			border-radius: 5px;
			margin: 10px 5px;
			padding: 5px;
			text-align: center;
			color: #000;
			box-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
			cursor: pointer;
			float: left;
			width: 70px;
			height: 90px;
		}

		footer {
			background-color: #192841;
			padding: 20px;
			box-sizing: border-box;
			text-align: center;
			color: #fff;
		}

		@media (max-width: 768px) {
			.sub-section {
				flex-basis: 100%;
			}

			.floating-elements {
				max-width: 100%;
			}
		}