

body {
	background-color: #000010;
	font-family: Arial, Helvetica, sans-serif;
}

nav {
	font-weight: bold;
	width: 100%;
	margin-right: 1em;
	padding: 1em;
	font-size: 120%;
	text-align: center;
}

nav ul {
	display: flex;
	justify-content: center;
	padding: 0;
	margin: 0;
}

nav li {
	display: inline-block;
	border-radius: 10px;
	padding: 10px;
	margin: 0 10px;
}

nav a{
	display: block;
	padding: 10px;
	border-radius: 10px;
	border: 1px solid #000000;
	text-decoration: none;
	color: #FFFFFF;
	background-color: #00C4FF;
}

.home-button{
	display: block;
	padding: 20px;
	border-radius: 10px;
	border: 1px solid #000000;
	text-decoration: none;
	color: #FFFFFF;
	background-color: #FF10F0;
}


nav a:link {color: #FFFFFF;}
.home-button:link {color: #FFFFFF;}

nav a:visited {color: #FFFFFF;}
.home-button:visited {color: #FFFFFF;}

nav a:hover {background-color: #FF10F0;}	
.home-button:hover {background-color: #FFFFFF; color: #FF10F0;}


h2 a {
	margin-left: 1em;
}

h2 a, aa{
	color: #FF10F0; 
	font-family: Arial, Helvetica, sans-serif;
	}
	

h2 aa {
	display: flex;
	justify-content: center;
	margin-left: 20%;
	margin-right: 35%;
}

h3 a {
	display: flex;
	justify-content: left;
	color: #FFFFFF;
	margin-right: 20px;
	margin-left: 1em;
}

h3 aa {
	display: flex;
	justify-content: center;
	color: #FFFFFF;
	margin-left: 20%;
}



footer {
	font-size: 75%;
	padding: 2em;
	font-style: italic;
	text-align: center;
	background-color:  #000010;
	color: #ff10f0;
	font-family: Georgia, "Times new Roman", sans-serif;
}

.screen-border {
	width: 100%;
	border-top: 3px solid #FFFFFF;
}

.container {
	overflow: hidden;
}

.right-image {
	display: block;
	float: right;
	margin-top: 2em;
	margin-bottom: 2em;
	width: 50%;
}

.text-left {
	overflow: hidden;
}

.left-image {
	display: block;
	float: left;
	margin-top: 5em;
	margin-bottom: 2em;
	margin-left: 2em;
	margin-right: 0;
	width: 50%;
}

.KillTeam-left-image {
	display: block;
	float: left;
	margin-top: 5em;
	margin-bottom: 2em;
	margin-left: 2em;
	margin-right: 2em;
	width: 40%;
}


.text-right {
	overflow: hidden;
}

.KillTeam-text-right {
	overflow: hidden;
	margin-left: 1em;
}



/****************************/
/*Dice roll page code block*/
/**************************/
#myAttacks,
#myTarget,
#myMod{
	margin-left: 0.5em;
	margin-right: 0.5em;
	width: 75px;
}

#dice-container 
{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}
	
#dice-image
{
    width: 100px;
    height: 100px;
}
/******************************/
/*End of Dice roll code block*/
/****************************/



/********************/
/*Table code blocks*/
/******************/	
table {
	border: 3px solid #000000;
	border-collapse: collapse;
}	


td, th {
	padding: 0.5em;
	border: 3px solid #000000;
}


td {
	font-size: 20px;
	font-weight: bold;
	text-align: center;
}

tr:nth-of-type(odd) {
	background-color: #00C4FF;
}

tr:nth-of-type(even){
	background-color: #FFFFFF;
}

tr:nth-child(1) {
	color: #FFFFFF;
	background-color: #FF10F0;
}	

.highlight{
	color: #FF10F0;
}
/**************************/
/*End of table code block*/
/************************/



/***************************/
/*Start of Form code block*/
/*************************/
form {
	margin-left: 3em;
	margin-right: 3em;
	display: flex;
	flex-direction: column;
	flex-wrap: nowrap;
	width: 100%;
	max-width: 30em;
	display: grid;
	grid-gap: 1em;
	grid-template-columns: 6em 1fr;
}

label {
	color: #FFFFFF;
}

input, textarea {
	margin-bottom: .5em;
}

#myFName, 
#myLName, 
#myEmail,
#myArmy {
	width: 250px;
}

#myComments {
	width: 350px;
	height: 100px;
}
/*************************/
/*End of Form code block*/
/***********************/



/************************/
/*Code to format images*/
/**********************/
.image-container {
	position: relative;
}

.background-image {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 70%;
}

.overlay-image {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	height: 100px;
	background-size: 10%;
	background-repeat: no-repeat;
}

.KillTeam-image {
	position: relative;
	z-index: 1;
	width: 100%;
	height: 50%;
}
/*******************************/
/*End of image formatting code*/
/*****************************/