#modalContainer {
	background-color:transparent;
	position:absolute;
	width:100%;
	height:100%;
	top:0px;
	left:0px;
	z-index:10000;
}

#alertBox {
	position:relative;
  /* increaded width to compensate for larger p text. */
	width:360px;
	min-height:100px;
	margin-top:50px;
  /* increased the thickness to be more visable and update the color via javascript based on grade with the function updateColor(grade). */
	border:6px solid #000;
  /* lightened background for readability */
	background-color:#ffffff;
  /* added calculated value for left to keep box centered.
  50vw for the center of the page - 180px for half the width of the box, since its position is based on the left most side.
  added !importaint to override the style set by javascript as it normally supersedes css styles */
  left: calc(50vw - 180px ) !important;
  /* added whole screen box shadow to draw more attention to alert box and make it more obvious that the rest of the screen is unable to be interacted with*/
  box-shadow: 0 0 0 100vw rgba(7, 7, 7, .4);
}

#modalContainer > #alertBox {
	position:fixed;
}

#alertBox h1 {
	margin:0;
  /* increased font size for readability */
	font:bold 1.1em verdana,arial;
  /* Update to mimic the colors of uw milwaukee */
	background-color:#FFBF11;
  /* Changed to black for better visability on the new background */
	color:#000;
	border-bottom:1px solid #000;
  /* increased padding on top and bottom. */
	padding:6px 0 6px 8px;
  /* removed uppercase to update font style from all upper to normal. */
  /* text-transform: uppercase; */
}

#alertBox p {
  /* increased font size for better readability */
	font:0.9em verdana,arial;
  /* removed height, padding-left, and margin-left to better display and align text */
	/* height:50px;
	padding-left:5px;
	margin-left:55px; */

  /* Added width and text align in order to center the text properly */
  width: 100%;
  text-align: center;
  /* added margin to top and bottom for layout improvement */
  margin: 25px auto;
  /* removed uppercase to update font style from all upper to normal. */
  /* text-transform: uppercase; */
}

#alertBox #closeBtn {
	display:block;
	position:relative;
	margin:5px auto;
	padding:3px;
  /* increased margin bottom for better layout */
  margin-bottom: 8px;
	border:1px solid #000;
	width:70px;
	font:0.7em verdana,arial;
	text-align:center;
  /* Changed to black for better visability on the new background */
	color:#000;
  /* Update to mimic the colors of uw milwaukee */
	background-color:#FFBF11;
	text-decoration:none;
  /* updated weight to bold and incresed size to make it easier to read. */
  font-weight: bold;
  font-size: .95em;
}

