html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.navbar-brand
{
  font-size: 30pt;
}

.card:has(a.stretched-link):hover  {
  transform: scale(1.02);
  box-shadow: 0 5px 10px rgba(0,0,0,.12), 0 2px 4px rgba(0,0,0,.06);
}

.card a.stretched-link  {
  text-decoration: none;
  font-weight: bold;
  color: #38a86c;
}

h5.card-title {
  color:#308dda;
  font-weight:bold;
}

div.benefactor div.card-body h5 {
  color:#ffad0a;
}

p.people {
  background-image: url(/images/people.png);
  padding-bottom:180px;
  background-position: bottom;
  background-repeat: no-repeat;
}

ol.breadcrumb {
  font-weight: bold;
  font-size: 150%;
  --bs-breadcrumb-divider: ":";
}

h1.huge {
  font-size: 6em;
  letter-spacing: -3px;
}

div#help-contents a.nav-link.active  {
  font-weight: bold;
}

h1 {
  color:#308dda;
  font-weight:bold;
  margin-bottom:12pt;
}

h1.homepage {
  font-size:400%;
}

h1.homepage-sm {
  font-size:300%;
}

h2 {
  color: #38a86c;
  margin-bottom:12pt;
  font-weight: bold;
}

h3 {
  color: #ffad0a;
}

div.homepage-points div div {

  font-size:150%;
  min-height: 65px;
  padding-left:75px;
  background-repeat: no-repeat;
  background-position: left;
  margin-bottom:12pt;

}

div.homepage-points div.point:nth-child(1) div {
  background-image: url(/images/yellow-tick.png);
  color: #ffad0a;
}
div.homepage-points div.point:nth-child(2) div {
  background-image: url(/images/blue-tick.png);
  color: #308dda;
}
div.homepage-points div.point:nth-child(3) div {
  background-image: url(/images/green-tick.png);
  color: #38a86c;
}

button.create-account-button {
  border: none;
  border-radius: 24px;
  padding:12px;
  color:white;
  font-weight: bold;
  background-color:#ffad0a;
}

button.create-account-button span 
{
  display: inline-block;
  background-color:white;
  height:24px;
  width:24px;
  border-radius: 12px;
  color:#ffad0a;
  font-weight: bold;
}

.video {
  text-align: center;
  width:100%;
  background-color:#38a86c;
  margin-bottom:18pt;
}

.sproutvideo-player {
  aspect-ratio: 16 / 9;
  width: 100%;
  margin:auto;
  max-width:768px;
  vertical-align: bottom
}

.youtube {
  aspect-ratio: 16 / 9;
  width: 100%;
  margin:auto;
  max-width:768px;
}

img.post-image {
  width: 100%;
  height: 300px;
  object-fit: cover;
}

img.blogroll-image {
  width:100%;
  height:100%;
  object-fit: cover;
}

div.categories a {
  color:#308dda;
  font-weight: bold;
  text-decoration: none;
}

div.categories a:hover {
  text-decoration: underline;
}

div.categories span {
  display: inline-block;
  margin-right: .5em;
}

div.step {
  margin-bottom: 16pt;
}

div.step h3 {
  color:#308dda;
  font-weight: bold;
}

div.step span {
  display: block;
  color:#38a86c;
  border:solid 5pt #38a86c;
  width:60px;
  height:60px;
  border-radius: 30px;
  text-align: center;
  margin-right:6pt;
  margin-bottom: 12pt;
  font-size:30px;
  font-weight: bold;
  float:left;

}