@charset "utf-8";
/* CSS Document:  used by HOME Page */
a {
  color: #EB2227;
  text-decoration: none;
}

a:hover,
a:focus {
  color: #AF1924;
  text-decoration: underline;
}
body {
	padding-top: 0px;
	font-size: 12pt;  /* this worked on Chrome, Edge.  It did NOT work in Firefox */
}
footer {
	padding: 2em 0;
	margin: 3em 0;
	border-top: 1px solid #ddd;
	color: #999;
	text-align: center;
}
div {
	/* font-size: large;    this worked on Chrome, Edge.  It did NOT work in Firefox  */
}

.glyphicon {
	color: #3f2b22;
}
<!-- use period to connect two classes when you want to set style for image element that has both classes applied in the same tag -->
.pull-right.img-responsive {
	 margin: 0 0 1em 1em;
}
<!-- use a space between two classes when you want to look for a class inside of another class -->
.pull-right img-responsive{
}

.btn-primary {
	background-color: #EB2227;
	border-color: transparent;
	color: #fff;
	border-radius: 0px;
}
.btn-primary:hover,  
.btn-primary:focus, 
.btn-primary:active, 
.btn-primary.active, 
.open .dropdown-toggle.btn-primary {
	color: #ffffff;
	background-color: #AF1924;
	border-color: transparent;
}
 /* aplos Green bar is  #5f9732;  */
.btn-donate {
	background-color: #5f9732;
	border-color: transparent;
	color: #fff;
	border-radius: 0px;
}
.btn-donate:hover,  
.btn-donate:focus, 
.btn-donate:active, 
.btn-donate.active, 
.open .dropdown-toggle.btn-donate {
	color: #ffffff;
	background-color: #4f7d2b;
	border-color: transparent;
}

.breadcrumb > li + li:before {
  padding: 0 5px;
  color: #cccccc;
  content: none;
}
.navbar-inverse .navbar-toggle {
	color: white;
	font-weight: bold;
	border-color: white;
}
.navbar-inverse .navbar-toggle:hover {
	background-color: #ddd;
	color: #333;
}
.navbar-inverse .navbar-toggle .glyphicon {
	color: white;
}
.navbar-inverse .navbar-toggle:hover .glyphicon {
	color: #333;
}
.tab-pane {
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding: 0.8em;
}
.active .glyphicon {
	color: #cdae51;
}
.carousel {       
	overflow: hidden;
}
.carousel .item {    
	-webkit-transition: opacity 1s;    
	-moz-transition: opacity 1s;    
	-ms-transition: opacity 1s;    
	-o-transition: opacity 1s;    
	transition: opacity 1s;
}
.carousel .active.left, .carousel .active.right {    
	left:0;    
	opacity:0;    
	z-index:2;
}
.carousel .next, .carousel .prev {    
	left:0;    
	opacity:1;    
	z-index:1;
} 
.navbar-nav > li > a {
	line-height: 24px
}
.navbar-collapse {
	padding-right: 0px;
	padding-left: 0px
}
.navbar-nav.nav-justified > li {
    float: none;
}
.navbar-nav.nav-justified > li + li +li + li + li + li + li > a {
	background-color: #EB2227;
	color: white
}
.navbar-nav.nav-justified > li + li +li + li + li + li + li > a:hover,
.navbar-nav.nav-justified > li + li +li + li + li + li + li > a:focus {
	background-color: #AF1924;
	color: white
} 

.navbar-nav.nav-justified > li > a {
	background-color: #f8f8f8;
	height: 100% !important;
}
.navbar-nav.nav-justified > li > a:hover, 
.navbar-nav.nav-justified > li > a:focus {
    color: #EB2227;
	background-color: white;
	line-height: 24px

}
.navbar-nav.nav-justified > li.active > a,
.navbar-nav.nav-justified > li.active > a:hover,
.navbar-nav.nav-justified > li.active > a:focus {
	color: #EB2227;
	background-color: white;
	line-height: 24px
}
.navbar {
    margin: 0;
	border-radius: 0px;
	min-height:30px !important;
	padding: 0px;
	border-width: 0px
}
.navbar-nav > li > a {
	padding-top:4px !important; 
	padding-bottom:4px !important;
}
.row-header {
	margin: 0px;
}
.row {
    margin-left: 0px;
    margin-right: 0px;
	/* font-size: x-large; this did NOT work here */
}
[class*="col-"] {
	padding: 0;
}
.row-padded {
  	padding: 15px 0px 15px 0px;
  	background-color: #17173D;
	margin-left: 0px;
    margin-right: 0px;
}
.row-padded ul {
  	padding: 0;
  	list-style-type: none;
}
.row-padded li {
  	padding-bottom: 5px;
}
.row-padded a {
  	color: #ffffff;
}
.row-tall {
	height: 400px
}
.row-text {
	margin-left: 15px;
	margin-right: 15px;
	margin-bottom: 15px;
	margin-top: 15px;
	/* font-size: 20px; this did NOT work here */
}
.row-text > p > a {
	color: #EB2227
}
.btn-facebook {
	border-radius: 0px;
}
.btn-twitter {
	border-radius: 0px;
}
.btn-linkedin {
	border-radius: 0px;
}
.btn-youtube {
	border-radius: 0px;
}
h4 {
	color: #6F81BF;  /* was #17173D  , new   */
}
h5 {
	color: white;
}
h3 {
	color: #6F81BF;  /* was #CCC , new  #0036cc  */
	font-family: Verdana, Geneva, sans-serif;
}
.nav-stacked > li + li {
  margin-top: 0px;
}
.nav-stacked > li {
  margin-top: 0px;
}
.nav-stacked > li > a {
  color: #4D4F4F;
  text-align: center;
  padding: 8px;
  background: #f8f8f8;
  margin: 0px;
  border-radius: 0px;
}
.nav-stacked > li > a:hover {
  color: #EB2227;
  background-color: transparent;
}
.nav-stacked > li.active > a:hover,
.nav-stacked > li.active > a:focus {
  color: #EB2227;
  background-color:transparent;
}
.nav-stacked > li.education > a {
	color: white;
	background-color: #131333;
	margin: 0px;
}
.nav-stacked > li.education > a:hover,
.nav-stacked > li.education > a:focus {
	color: #131333;
	background-color: #CCC
}
.nav-stacked > li.education-active > a {
	background-color: #131333;
	color: white;
	line-height: 20px
}
.nav-stacked > li.research > a {
	color: white;
	background-color: #525FAB; /* was 303283 */
}
.nav-stacked > li.research > a:hover,
.nav-stacked > li.research > a:focus {
	color: #131333;
	background-color: #CCC
}
.nav-stacked > li.research-active > a {
	background-color: #525FAB;  /* was 303283 */
	color: white;
	line-height: 20px
}
.nav-stacked > li.resources > a {
	color: white;
	background-color: #303283 /* was 525FAB */
}
.nav-stacked > li.resources > a:hover,
.nav-stacked > li.resources > a:focus {
	color: #131333;
	background-color: #CCC
}
.nav-stacked > li.resources-active > a {
	background-color: #303283;  /* was 525FAB */
	color: white;
	line-height: 20px
}
.nav-stacked > li.community > a {
	color: white;
	background-color: #6F81BF
}
.nav-stacked > li.community > a:hover,
.nav-stacked > li.community > a:focus {
	color: #131333;
	background-color: #CCC
}
.nav-stacked > li.community-active > a {
	background-color: #6F81BF;
	color: white;
	line-height: 20px
}
.panel-affiliates {
	height: 175px;
	margin: 0px 15px 0px 15px;
	border-bottom-color: #CCC;
	border-left-color: #CCC;
	border-right-color: #CCC;
	border-radius: 0px
}
.panel-affiliates > .panel-heading {
	background-color: #AF1924;
	color: white;
	text-align: center;
	border-radius: 0px
}
.panel-default {
	border-radius: 0px;
}
.panel-default > .panel-heading {
	text-align: center;
	border-radius: 0px
}
.focusareablue {
	background-color: #999;
	height: 144px;
	color: white;
	padding: 10px 30px 10px 20px
}
.educationblue {
	background-color: #131333;
	height: 144px;
	color: white;
	padding: 10px 30px 10px 20px
}
.educationblue > h2 {
	margin-top: -10px
}
.researchblue {
	background-color: #525FAB; /* was #303283, also adjust li.resources-active above */
	height: 144px;
	color: white;
	padding: 10px 30px 10px 20px
}
.researchblue > h2 {
	margin-top: -10px
}
.resourcesblue {
	background-color: #303283;  /* was #525FAB, also adjust li.research-active*/
	height: 144px;
	color: white;
	padding: 10px 30px 10px 20px
}
.resourcesblue > h2 {
	margin-top: -10px
}
.communityblue {
	background-color: #6F81BF;
	height: 144px;
	color: white;
	padding: 10px 30px 10px 20px
}
.communityblue > h2 {
	margin-top: -10px
}
li.education {
	line-height: 20px
}
li.research {
	line-height: 20px
}
li.resources {
	line-height: 20px
}
li.community {
	line-height: 20px
}
@media (max-width: 767px) {
	.educationblue,
	.resourcesblue,
	.researchblue,
    .communityblue {
		height: auto
	}
}
p.article {
	line-height: 2
}

.events-table th {
    text-align: center;
    line-height: 2.5;
}
.events-table td {
    padding: 5px;
}