/*This initial group of classes can be overwritten on a per-site basis 
to customize the color of each element in the global footer for that site.*/

div#apmFooter .apmFooterBarColor{
  background:#000;
}
div#apmFooter .apmFooterBarTextColor{
	color:#fff;
}
div#apmFooter .apmFooterTitleTextColor{
	color:#000;
}
div#apmFooter .apmFooterBackgroundColor{
  background:#fff;
}
div#apmFooter .apmFooterContentTextColor{
	color:#000;
}
div#apmFooter .apmFooterContentLinkColor a{
	color:#B70005;
}






/*Everything below should only be overwritten when the site 
needs to completly restyle the footer. */

div#apmFooter{
  font: 12px "Arial","Verdana",sans-serif;
	overflow: auto;
	width: 100%;
}
div#apmFooter img{
  border:0;
}

/* Controls top color bar with the APM logotype and text (apmFooterBar) */

div#apmFooter #apmFooterBar{
	color:#fff;
	overflow: auto;
	width: 100%;
}
div#apmFooter #apmFooterBar span.separator{
  padding:10px;
}
div#apmFooter #apmFooterBar span#apmFooterBarImage{
  float:left;
	padding:10px;
}
div#apmFooter #apmFooterBar span#apmFooterBarText{
  float:right;
	padding:10px;
}


/* Controls content area of footer (apmFooterContent) */

div#apmFooter div#apmFooterContent .title{
  font-size:.95em;
	font-weight:bold;
	text-transform:uppercase;
	margin-bottom:6px;
	display:block;
}

div#apmFooter div#apmFooterContent div#apmProgs{
	width:55%;
	float:left;
	margin:10px 0 10px 10px;
}
div#apmFooter div#apmFooterContent a{
  color:#B70005;
}
div#apmFooter div#apmFooterContent div#apmProgs ul{
	padding:0;
	margin:0;
	overflow:auto;
}
div#apmFooter div#apmFooterContent div#apmProgs li{
  float: left;
  width: 180px;
	list-style-type:none;
	line-height:20px;
}

div#apmFooter div#apmFooterContent div#apmFooterSupport{
  width:20%;
	float:left;
	margin:10px 0 0 0;
}

div#apmFooter div#apmFooterContent div#apmFooterMore{
  width:16%;
	float:left;
	margin:10px 0 10px 50px;
}						 
div#apmFooter div#apmFooterContent div#apmFooterMore ul{
  margin:0;
	padding:0;
}
div#apmFooter div#apmFooterContent div#apmFooterMore li{
	list-style-type:none;
	line-height:20px;
}


/* There's an option for a final section after the content section. 
There's nothing in there now, but the option is there. */

div#apmFooter #apmFooterEnd{
  clear:both;
}

@media only screen and (max-width: 768px){

	div#apmFooter div#apmFooterContent div#apmProgs, div#apmFooter div#apmFooterContent div#apmFooterMore{
		float: none;
		display: block;
		margin: 0;
	}

	div#apmFooter #apmFooterBar span#apmFooterBarImage, div#apmFooter #apmFooterBar span#apmFooterBarText{
		float: none;
		display: block;
	}

}