
.clear { clear: both;}

#appContainer {
	width: 100%; 
	text-align: center;
	overflow: auto;
}

#appIconArea {
	width: 400px;
	height: 420px;
	display: inline-block;
	vertical-align: top;
	margin-left: auto;
	margin-right: 40px;
}

#appInfoArea {
	width: 535px;
	height: 440px;
	display: inline-block;
	vertical-align: top;
	margin-right: auto;
}

#appBannerArea {
	padding-top: 14px;
	text-align: center;
	color: #990000;
	font-family: Arial;
	font-weight: bold;
	font-size: 16pt;
}

#appInfoSidebar {
	text-align: left;
}

@media screen and (max-width: 1100px) {
	#appIconArea {
		width: 100%;
		text-align: center;
		margin: auto;
	}
	
	#appInfoArea {
		height: auto;
	}
	
	#appBannerArea {
		padding-top: 2px;
	}
	
	#appInfoSidebar {
		width: 100%;
		text-align: center;
		margin: auto;
	}
}


tr.buttonRow > td {
	padding-bottom: 8px;
}


td.buttonRowIcon {
	
}

td.buttonRowTitle {
	font-family: Arial;
	font-weight: bold;
	font-size: 18pt;
	color: #440000;
	text-shadow: 1px 1px 4px #555555;
	padding-left: 4px;
}

td.buttonRowTitle > a {
	text-decoration: none;
	color: #440000;
}

td.buttonRowTitle:hover {
	color: #660000;
	text-shadow: 1px 1px 8px #555555;
}

td.buttonRowIcon:hover + td.buttonRowTitle {
	color: #660000;
	text-shadow: 1px 1px 8px #555555;
}

td.buttonRowDetails {
	padding-left: 12pt;
	color: #777777;
}

td.buttonRowDetails > a {
	color: #777777;
}

.buttonRowDetails:hover,
.buttonRowIcon:hover ~ .buttonRowDetails,
.buttonRowTitle:hover + .buttonRowDetails {
	color: black;
}

.buttonRowDetails:hover > a,
.buttonRowIcon:hover ~ .buttonRowDetails > a,
.buttonRowTitle:hover + .buttonRowDetails > a {
	color: #003366;
}

div.divider {
	height: 1pt;
	width: 100%;
	background-color: #999999;
}

.topicHeading {
	font-family: Tahoma;
	font-size: 18pt;
	font-weight: bold;
	padding-left: 16pt;
	padding-right: 16pt;
	padding-top: 8pt;
	padding-bottom: 3pt;
}

.topicBody {
	padding-left: 16pt;
	padding-right: 16pt;
	font-size: 12pt;
}
