/* Logo Height on Scroll - from Dan Fisher template update */
.header.headhesive.headhesive--stick .logo img {
	/*height: 28px;*/
}

/* Add your CSS here */
.DisplayFld { background-color: #dddddd;}

.tinytext {
   font-family: Arial,Helvetica,sans-serif;
   font-size: 11px;
}

.red {
 color:#FF0000;
}

.content a.btn-primary {
    font-family: "Oswald",sans-serif;
    text-transform: uppercase;
	text-decoration: none;
    background-color: #337ab7;
    border-color: #2e6da4;
    color: #fff;
}

.content a.btn-primary:hover,
.content a.btn-primary:focus {
  background-color: #502da3;
  border-color: #502da3;
  color: #fff;
  text-decoration: none;
}

.widget .panel-body
{
  padding:0;
  padding-left:15px;
}

.call-to-action {
margin-bottom:20px;
padding: 20px 30px;
font-size: 14px;
}

 .header-menu-fullw .navbar-collapse .navbar-nav > li > a {
   /* top,rt,bot,left */
    padding: 0 18px; /* On Firefox with active tab, header items don't fit; was 20px */
  }
  
.fhmm .navbar-collapse .navbar-nav > li > a {
 font-size:18px;	 
 }

.dirspc {
padding-left:20px;
}

.bbp-forums .bbp-header .bbp-forum-info,
.bbp-forums .bbp-body .bbp-forum-info {
  width: 71%;
}

.bbp-forums .bbp-header .bbp-forum-freshness,
.bbp-forums .bbp-body .bbp-forum-freshness {
  width: 29%;
 }
 
.directory-left {
float:left;
width:45%;	
}

.directory-right {
float:right;
width:45%;
} 

.brclearplus {
	clear:both;
	height:10px;
	margin:0;
	font-size: 1px;
	line-height: 0;
}

.hp-event {
	padding-left:80px;
	margin-bottom:15px;
	margin-top:0px;
	max-width:1111px;
}

/*****************************
 * Tablet (Portrait)
 *****************************/

@media only screen and (max-width: 768px)
{
   .hp-event {
	padding-left:0px;
  }
}

@media only screen and (min-width:481px) {
/* sc - add banner bg image - but not for phones */
.navbar-header {
	background-color: #502DA3;
	background-image:none;
  /* spiral pattern: background: url("https://therra.org/images/RRA-header-2000.jpg") no-repeat scroll 50% 0 transparent;*/
 }
}

.page-content {
  padding-top: 30px; /* was 50px;*/
  padding-bottom:30px;
}

/* Logo */
.header .logo {
  margin: 0;
  /* padding: 29px 0;*/
  padding: 5px 0; /* sc */
  -webkit-transition: 0.2s;
  transition: 0.2s;
  float: left;
}

.page-heading {
    /* bar to match footer color bar- background: none repeat scroll 0 0 #2b257b;*/ 
	background: none repeat scroll 0 0 #ffffff;
}
/* to remove grey border around page-heading, when use white: */
.page-heading {
  /*border-top: 6px solid #d4d4d4;*/
  border-top:none;
  border-bottom: none;
 } 
 
 .header-fullw .page-heading {
   border-top: 6px solid #d4d4d4;
  }
.header-fullw .page-heading h1 {  
  /* top,rt,bot,left*/
   padding: 30px 0 0px 0;
  }
  
 .tp-banner-holder {
  border-bottom: none;
  }
.tp-banner-holder::after, .page-heading::before, .page-heading::after  {
    background: none repeat scroll 0 0 #ffffff;
}

.header-fullw .page-heading::before {
  background: none repeat scroll 0 0 #bfbfbf;
}

/* reduce page heading bar height a little: */
.page-heading h1 {
  font-family: 'Lato', sans-serif;
  font-weight:700;
  font-size:24px; /* some letters don't render well with 24px and Oswald */
  color: #ca9302; /* HAP gold heading and links #d77337;*/
  /* with blue bar: color: #fff;*/
   /* gold to match logo #fcc22c; - too light against white*/
         /* top,rt,bot,left*/
   padding: 2px 0 21px 0;
   /* idea: text-shadow: 1px 1px 1px #333333;*/
   /*text-transform:none;*/
}
.page-heading .breadcrumb {
    padding: 5px 0 21px 0;
 }
 
 .page-heading .breadcrumb a {
    color: #ca9302;
}

.breadcrumb > li + li::before {
    color: #0b1564; /* bullets */
}

.breadcrumb > .active {
    color: #0b1564 !important;
}

.content .highlight {
color: #0b1564;
font-weight:bold;
}
 

/* ALTERNATE - gold bar and navy page heading: */
/*
.page-heading h1 {
  color: #0b1564;
}
.page-heading {
    background: none repeat scroll 0 0 #fcbc13; -match logo gold 
}
*/

.page-content h3 {
color: #0b1564;
}
.page-content h3.gold {
 color: #ca9302;
}

.page-content h3.widget-title {
 font-size: 16px;
  color: #502da3;
}

p.headline {
font-size:1.2em;
color: #0b1564;
/*font-weight:bold;*/
}

body {
  color: #333333; /* #6d6d6d;*/
}

.header-top {
    color: #2f2f2f; /* phone on top #a3a3a3;*/
}



/* For plain disc bullets: */
.listbull ul {
  padding-left: 10px;
  margin-bottom: 1.5em;
}
.listbull ul li { /* instead of default list with arrow bullets */
  position: relative;
  padding: 0 0 8px 5px; /*  top,rt,bot,left */
}
.listbull ul li:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  font-size: 14px;
  color: #dc2a0b;
  margin-right: 10px;
  font-style: normal;
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.content .fa-file-pdf-o:before {
  color:#CC0000;  /* add red */
}

.content a.hidel {
 text-decoration:none;
 color:#333333;
}

.page-content .col-md-3 > h3, .content > h3 {
 margin-top:5px;
}

.content .tabs .nav-tabs > li > a {
 font-weight:bold;
  color: #0b1564;
}

.content .tabs .nav-tabs > li.active > a {
 text-decoration:none;
 color:#502da3 !important;
}

.list ol li::before {
  color:#666666;
}

/* font size is 14px - see theme.css line 72 and 76 - tabs are exception */

.listgold {
  overflow: hidden;
}
.listgold ul {
  padding-left: 0;
  list-style: none;
  margin-bottom: 1.5em;
}

.listgold ul li {
  position: relative;
  padding: 0 0 8px 20px;
}
/* see theme-elements.css default list with arrow bullets */
.listgold ul li:before {
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  content: "\f192";  /* circle solid "\f111";*/
  font-family: 'FontAwesome';
  font-size: 14px;
  color: #ca9302; /* lighter #fcbc13;*/ /* darker #ca9302; */
  margin-right: 10px;
  font-style: normal;
  font-weight: normal;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.listgold ul li ol {
 padding:0;
 margin-left:15px;
}
.listgold ul li ol li:before {
  content: "";
  margin-right:0;
  padding:0;
}
.listgold ul li ol li span { 
  position: relative; 
  left: -15px; 
}

.short-list ul li { /* more space between list items for a short list */
 padding-bottom: 10px;
}

#hp-image {
 margin:0; padding:0;
 width: 100%; /* pixel width messes up photo centering responsively */
}

 #hp-container {
  position: relative;
  margin: 0 auto;
  padding: 0;
  width:1010px; 
  padding-top:30px;
  padding-bottom:0; 
  color:#000000;
  font-family: 'Lato', sans-serif;
  font-weight:400;
 }
 
 #hp-container a, .content a {
   color: #0b1564;
 }
 
 .content a.btn-default {
 text-decoration:none;
 color:#333333;
 text-transform:none;
 font-size:14px;
 font-family:Arial, Helvetica, sans-serif;
 font-weight:bold;
 }
 
 /* needed to supercede Dynmic Drive's Fade slideshow css on home page:*/
 /*
 #hp-image .aligncenter img {
  border: 1px solid #cecece !important;
  height: auto !important;
 } 
*/
  
 /* see purple.css for hover - underline default*/
.content-title {
 text-transform:uppercase;
 font-weight:700;
 font-family:'Lato',sans-serif; 
}
.content a {
 text-decoration:underline;
 } 
.content a:hover, .content .tabs .nav-tabs > li > a:hover {
  text-decoration: none;
  color:#ca9302;
 }
 
.content .panel-group .panel-title > a:hover {
  color:#fff;
}

.content .panel-group .panel-title > a.collapsed:hover {
  color: #6d6d6d;
} 

.panel-body p {
    margin: 0 0 0.8em;
}
 
.widget__sidebar ul li a:hover {
/* tried bg color:
   text-decoration: none;
   background-color:#fcbc13;
   */
  /* for bar across-display:block;*/
  /* shifts text:
  padding-top:5px;
  padding-bottom:5px;
 
  */
}
 
 #hp-container .col-md-6 {
   margin-right: 70px;	
}
 
 #hp-container h2 {
  color:#502da3;
  font-size:26px;
  margin-bottom:12px;
 }
 
 #hp-container .news-item .headline a, #hp-container .news-item .headline {
    color: #0b1564;
	font-size:20px;
	font-family: 'Lato', sans-serif;
	font-weight:700;
	text-decoration:none;
 }
  #hp-container .news-item .headline a:hover {
    text-decoration:underline;
  }
 
 #hp-container .news-item .date {
	font-family: 'Lato', sans-serif;
	font-weight:900;
	color: #717495;
	font-size:12px; 
 }
 
 #hp-container p {
	color:#000000;
	line-height: 19px;
 }
 
 .footer-widgets {
  padding: 40px 0 14px 0;
}
.contacts-widget {
  margin-bottom:0px;
}
.products .product .project-desc {
  text-align: center;
}

.project-item figure img {
 opacity: 1; /* theme uses 0.8 */
}
 
 .fhmm .navbar-collapse .navbar-nav > li > a,
 .fhmm .navbar-collapse .navbar-nav > li.open > a {
    color: #0b1564;
 }
 
   .fhmm .navbar-collapse .navbar-nav > li > a:focus,
   .fhmm .navbar-collapse .navbar-nav > li.open > a:focus {
	  color: #0b1564;
   }
 
  .fhmm .navbar-collapse .navbar-nav > li.active > a,
  .fhmm .navbar-collapse .navbar-nav > li.active > a:focus {
    color:  #0b1564;
  }
  
  .fhmm .navbar-collapse .navbar-nav > li > a:hover,
  .fhmm .navbar-collapse .navbar-nav > li.active > a:hover {
    color:  #502da3;
  }
  
  .fhmm .navbar-collapse .navbar-nav > li.open > a:hover {
    color: #502da3;  /* #2f2f2f;*/
  }

.footer {
  background: #2b257b;
  color: #ffffff;
}

.footer-copyright {
  border-top: 1px solid #211e62;
  background: #231e62;
  font-size: 11px;
  padding: 20px 0;
}

.footer-copyright a:hover {
 color: #ffffff;
}

.social-links > li > a {
  background: #363082;
  border:none;
  color: #ffffff;
}

.social-links > li > a:hover {
  border:none;
  color: #231e62;
}


@media only screen and (min-width:1201px) and (max-width: 1300px) { 
#hp-image .imgtext { 
/* when photo resized for smaller viewport, resize text */
   font-size: 1.35vw !important; 
   line-height:1.75vw !important;
   margin-right:2.5%!important;
   /*width: 25vw;*/ 
 }
 
 .imgtext p.more {
   font-size: 1.35vw !important; 
 }

}

/* As viewport gets smaller, text becomes smaller than needed: */
@media only screen and (min-width:992px) and (max-width: 1200px) { 
#hp-image .imgtext { 
/* when photo resized for smaller viewport, resize text */
   font-size: 1.6vw !important; 
   line-height:2vw !important;
   margin-right:2.5%!important;
 }
 .imgtext p.more {
   font-size: 1.5vw !important; 
 }

}

/* Box is too wide in this range : */
/* Font needs to reduce again at this width: */
@media only screen and (min-width:750px) and (max-width: 991px) { 
#hp-image .imgtext { 
   max-width: 276px!important; 
 }
#hp-image .imgtext { 
   font-size: 13px !important; 
   line-height:18px !important;
   margin-right:2.5%!important; 
   padding-left:12px !important;
 }
  
.imgtext p {
 margin-bottom:10px !important; 
}
.imgtext p.more {
   font-size: 12px !important; 
   line-height:7px !important;
  } 
 }


@media only screen and (min-width:767px)  {
.page-content .container {
 /* text does not align with logo. See bootstrap.min.css */
 /* MESSES UP CENTERING on home page so removed! padding-left:30px;*/ 
 }
}
@media only screen and (max-width:1010px)  {
 #hp-container {
	 padding-left:10px;
 }
}

@media (min-width: 992px) {
  .header.headhesive.headhesive--stick .logo img {
  /* SC - changed for RRA logo - but now not using headhesive */
    height:  115px; /*28px;*/
  }

}

/* NOTE - changes to occur when button is used for menu:*/
@media only screen and (max-width:991px) {
 .fhmm .navbar-collapse .navbar-nav > li > a,
 .fhmm .navbar-collapse .navbar-nav > li.open > a {
    color: #ffffff;
 }
 
 .fhmm .navbar-collapse .navbar-nav > li > a {
 font-size:16px;	 
 }
 
   .fhmm .navbar-collapse .navbar-nav > li > a:focus,
   .fhmm .navbar-collapse .navbar-nav > li.open > a:focus {
	  color: #ffffff;
	  font-weight:bold;
   }
 
  .fhmm .navbar-collapse .navbar-nav > li.active > a,
  .fhmm .navbar-collapse .navbar-nav > li.active > a:focus {
    color:  #ffffff;
	font-weight:bold;
  }
  
  .fhmm .navbar-collapse .navbar-nav > li > a:hover,
  .fhmm .navbar-collapse .navbar-nav > li.active > a:hover {
    color:  #ffffff;
	text-decoration:underline;
  }
  .fhmm .navbar-collapse .navbar-nav > li > ul > li > a:hover {
    text-decoration:underline;
  }
  
  .fhmm .navbar-collapse .navbar-nav > li.open > a:hover {
    color: #ffffff;
  }
}

@media only screen and (max-width:749px) { 
.imgtext {
  display:none; /* because the text becomes very small */
}

#hp-container {
  width:auto;
  max-width: 100%;
}

#hp-container .col-md-6 {
   margin-right: 0px;	
}

  .fhmm .navbar-collapse .navbar-nav > li > a,
  .fhmm .navbar-collapse .navbar-nav > li.open > a {
    color: #fff;
 }
 
   .fhmm .navbar-collapse .navbar-nav > li > a:focus,
   .fhmm .navbar-collapse .navbar-nav > li.open > a:focus {
	  color: #fff;
   }
 
  .fhmm .navbar-collapse .navbar-nav > li.active > a,
  .fhmm .navbar-collapse .navbar-nav > li.active > a:focus {
    color:  #fff;
  }
  
  .fhmm .navbar-collapse .navbar-nav > li > a:hover,
  .fhmm .navbar-collapse .navbar-nav > li.active > a:hover {
    color:  #fff;
  }
  
  .fhmm .navbar-collapse .navbar-nav > li.open > a:hover {
    color: #fff;
  }
}

@media only screen and (max-width:767px) { 
 .contacts-widget {
  margin-bottom:35px; /* when left and right info stacks vertically*/
 }
}

/* Handle odd sizes: */
@media only screen and (min-width:576px) and (max-width:640px) {
.logo img {
  height: auto !important; 
  max-width: 500px;
 }	

}

@media only screen and (min-width:481px) and (max-width:575px) {
.logo img {
  height: auto !important; 
  max-width: 400px;
 }	
/* Remove home page photo */
 .mainimage, #hp-image .imgtext {
  display:none;
 }
 #hp-container { /* when main image removed */
	 padding-top:0;
	 padding-left:10px;
 }
 .page-content {
  padding-top: 20px;
 }
 
.sidebar { /* it drops to bottom, but remove altogehter */
 /*display:none; - DISPLAY SIDEBAR 9/2016 because Ethics and Resolutions don't have any other nav on phones */
 }
 img { /* needed for occasional home page image */
  height:auto;
  max-width:100%;
 }

}

/* Note: Design for width of wider phones, up to 480px */
@media only screen and (max-width:480px) {
 .navbar-header {
	background-color: #502DA3;
	background-image:none;
  /* background: url("/images/RRA-header-mobile.jpg") no-repeat scroll 50% 0 transparent;*/
}

 .dirspc { /* for member's alpha directory */
  padding-left:20px;
 }

 .logo img {
    height: auto !important; 
    max-width: 360px;
 }
 .header .logo {
  padding: 15px 0; 
 }
 
 .mainimage, #hp-image .imgtext {
  display:none;
 }
  #hp-container { /* when main image removed */
	 padding-top:0;
	 padding-left:10px;
 }
 .page-content {
  padding-top: 20px;
 }
 
.directory-left {
float:none;
display:block;
width:100%;	
}

.directory-right {
float:none;
display:block;
width:100%;
margin-top:15px;
} 
 
 .sidebar { /* it drops to bottom, but remove altogehter */
 /*display:none; - DISPLAY SIDEBAR 9/2016 because Ethics and Resolutions don't have any other nav on phones */
 }
 
 img { /* needed for occasional home page image */
  height:auto;
  max-width:100%;
 }
 .hp-event {
	padding-left:0px;
 }
 #eventdate {
  float:none !important;
  font-size:16px !important;
}
 #donatebutton {
  float:none !important;
  margin-top:12px !important;
 }
 
}

@media only screen and (min-width:420px) and (max-width:440px) {
 .logo img {
    height: auto !important; 
    max-width: 340px;
  }
 .header .logo {
  padding: 15px 0; 
 }
 
  img { /* needed for occasional home page image */
  height:auto;
  max-width:100%;
 }
 .hp-event {
	padding-left:0px;
 }
 
 #eventdate {
  float:none !important;
  font-size:16px !important;
}
 #donatebutton {
  float:none !important;
  margin-top:12px !important;
 }
 
 
}

@media only screen and (max-width:419px) {
  .logo img {
    height: auto !important; 
    max-width: 275px; /* leave room for nav button */
 }
 .header .logo {
  padding: 20px 0; 
 }
 
 #eventdate {
  float:none !important;
  font-size:16px !important;
}
 #donatebutton {
  float:none !important;
  margin-top:12px !important;
 }


}

/* Smartphone portrait - old iphone width */
@media only screen and (max-width:320px) {

  .logo img {
    height: auto !important; 
    max-width: 240px; /* leave room for nav button */
 }
 .header .logo { /* align with nav button */
  padding: 25px 0; 
 }
 
 img { /* needed for occasional home page image */
  height:auto;
  max-width:100%;
 }
 
 .hp-event {
	padding-left:0px;
 }
 
 #eventdate {
  float:none !important;
  font-size:16px !important;
}
 #donatebutton {
  float:none !important;
  margin-top:12px !important;
 }


}