File diff 128529dc6af1 → 32dd831a5056
www/conservancy/static/css/conservancy.css
Show inline comments
...
 
@@ -5,23 +5,88 @@ body { margin: 0; padding: 0; }
 
.hidden { display: none; }
 

	
 
p, h1, h2, h3, h4, h5, h6, #mainContent ul, #mainContent ol {
 
  margin-top: 1em;
 
  /* margin-top: 1em; */
 
  margin-bottom: 1em;
 
}
 

	
 
p {
 
  line-height: 1.6;
 
}
 

	
 
html {
 
  /* Standard colorss. */
 
  --khaki-green: #587733;
 
  --light-green: #afe478;
 
  --light-blue: #92d4d1;
 
  --navy: #224c57;
 
  --orange: #ec6343;
 
  --orange-dim: #e05340;
 
}
 

	
 
/* Some Tachyons-like classes to apply those standard colors. */
 
.bg-light-blue { background: var(--light-blue); }
 
.bg-orange { background: var(--orange); }
 
.orange { color: var(--orange); }
 
.b--light-blue { border-color: var(--light-blue); }
 
.navy { color: var(--navy); }
 

	
 
body {
 
/*  font-family: "Lucida Grande",Verdana,Lucida,Helvetica,Arial,sans-serif; */
 
  font-family: "Lucida Sans Unicode", "Lucida Grande", "Verdana", "FreeSans", sans-serif;
 
  font-size: large;
 
  /* Native font stack as per Bootstrap 5.1. */
 
  font-family:
 
    system-ui,
 
    -apple-system,
 
    "Segoe UI",
 
    Roboto,
 
    "Helvetica Neue", Arial,
 
    "Noto Sans",
 
    "Liberation Sans",
 
    sans-serif,
 
    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 
  font-size: .875rem;
 
  color: #333;
 
}
 

	
 
a {
 
  text-decoration: none;
 
  color: var(--navy);
 
  transition: all .2s ease;
 
  font-weight: bold;
 
}
 
a:hover { text-decoration: underline; }
 

	
 
a { text-decoration: none; color: #557733; }
 
a:hover { text-decoration: underline; color: #577632; }
 
a.read-more {
 
    cursor: pointer;
 
    font-style: italic;
 
}
 

	
 
.btn-orange {
 
  color: white;
 
  background: var(--orange);
 
  border: 1px solid var(--orange-dim);
 
}
 
.btn-orange:hover {
 
  background: var(--orange-dim);
 
  text-decoration: none;
 
  box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
 
}
 
.btn-white {
 
  color: var(--orange);
 
  background: white;
 
}
 
.btn-white:hover {
 
  background: #eee;
 
  text-decoration: none;
 
  box-shadow: 1px 1px 1px rgba(0,0,0,0.2);
 
}
 

	
 

	
 
a svg {
 
  transition: all .2s ease;
 
}
 
a:hover svg {
 
  transform: scale(1.1);
 
}
 

	
 
.toggle-control  {
 
cursor: pointer;
 
text-decoration: none; color: #557733;
...
 
@@ -49,15 +114,11 @@ p.footnote {
 
}
 

	
 
h1 { margin-top: .75em; margin-bottom: .5em; }
 
h2 { margin-top: .75em; margin-bottom: .5em; }
 
/* h2 { margin-top: .75em; margin-bottom: .5em; } */
 
h3 { margin-top: .6em; margin-bottom: .4em; }
 

	
 
#mainContent h1 { border-bottom: 1px solid #00334b; }
 
#mainContent h2 { border-bottom: 1px solid #aaa; }
 

	
 
#mainContent ul, #mainContent ol { padding-left: 1.5em; }
 

	
 
#mainContent img { margin: 3px; }
 

	
 
.internalNavigate { width: 19%; float: right; }
 
#mainContent .internalNavigate ul { list-style-type: none; padding-left: 0; }
...
 
@@ -66,17 +127,15 @@ h3 { margin-top: .6em; margin-bottom: .4em; }
 
/* Header */
 

	
 
#conservancyheader {
 
  margin: 0;
 
  /* Leave 0 padding on the right so the header image is clipped by the edge of
 
   * the browser window. */
 
  padding: 10px 0 10px 17px;
 
  max-width: 1140px;
 
  margin: 0 auto;
 
  padding: 10px 0;
 
/*  background-color: #d1ff96; */
 
/*  background-color: #92CC58; */
 
/*  background-color: #BDD8A2; */
 
/*  background-color: #92cc58; */
 
/*  background-color: #b5cd9d; */
 
  background-color: #ffffff;
 
  border-bottom: 1px solid #808080;
 
  text-indent: -5000px; /* hide in favor of image */
 
}
 
#logobutton {
...
 
@@ -84,51 +143,31 @@ h3 { margin-top: .6em; margin-bottom: .4em; }
 
  margin: 0;
 
  padding: 0;
 
  height: 120px;
 
  width: 100%;
 
  min-width: 350px;  /* So at least tree and text is visible */
 
  background: url(/img/conservancy-header.png) no-repeat;
 
  background-size: contain;
 
}
 

	
 
/* Navigation bar */
 
#navbar-outer { background: #577632; }
 
#navbar { margin-left: 104px; margin-top: 3px; float: left; display: inline; }
 
#navbar-outer { background: var(--navy); }
 
#navbar { margin-top: 3px; max-width: 1140px; margin: 0 auto;}
 
#navbar ul { list-style: none; }
 
#navbar-clear { clear: both; border-bottom: 1px solid #808080; }
 
#navbar li.supporter a {
 
  display: block;
 
  background: #fafafe;
 
  padding: .2em .8em;
 
  margin-right: 3px;
 
  border: 1px solid #808080;
 
  font-size: .8em;
 
  background: #ffd843;
 
  background: -moz-linear-gradient(top, #fff, #ffd533);
 
  background: -webkit-linear-gradient(top, #fff, #ffd533);
 
  background: linear-gradient(to bottom, #fff, #ffd533);
 
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#ffd533', GradientType=0);
 
  border-color: #ffffff;
 
}
 
#navbar-clear { clear: both; }
 
#navbar li a {
 
  display: block;
 
  background: #fafafe;
 
  padding: .2em .8em;
 
  margin-right: 3px;
 
  border: 1px solid #808080;
 
  font-size: .8em;
 
  background: #eaf1f1;
 
  background: -moz-linear-gradient(top, #fff, #eaf1f1);
 
  background: -webkit-linear-gradient(top, #fff, #eaf1f1);
 
  background: linear-gradient(to bottom, #fff, #eaf1f1);
 
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eaf1f1', GradientType=0);
 
  border-color: #ffffff;
 
}
 
#navbar li:hover a { background: #577632; color: #fff; }
 
#navbar li.supporter:hover a { background: #577632; color: #CE1F1F; }
 
  color: white;
 
  padding: .5em .8em .1em;
 
  margin: 0 3px .1em 0;
 
  text-decoration: none;
 
  border-bottom: 4px solid transparent;
 
}
 
#navbar li:hover a {
 
  border-bottom: 4px solid var(--light-green);
 
}
 
#navbar li { float: left; display: inline; margin-bottom: 3px; }
 

	
 
#mainContent {
 
    margin-left: 50px;
 
    margin-right: 50px;
 
  max-width: 1140px;
 
  margin: 0 auto;
 
}
 
#sidebar + #mainContent {
 
    float: left;
...
 
@@ -390,23 +429,7 @@ body.conservancy-donate #navbar ul li.donate a,
 
body.conservancy-npoacct #navbar ul li.npoacct a,
 
body.conservancy-sponsors #navbar ul li.sponsors a /* NO COMMA HERE! */
 
{
 
    color: #000033;
 
    font-weight: bold;
 
    background: #eaf1f1;
 
    background: -moz-linear-gradient(bottom, #fff, #eaf1f1);
 
    background: -webkit-linear-gradient(bottom, #fff, #eaf1f1);
 
    background: linear-gradient(to top, #fff, #eaf1f1);
 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eaf1f1', endColorstr='#ffffff', GradientType=0);
 
}
 
body.conservancy-supporter #navbar ul li.supporter a
 
{
 
    color: #000033;
 
    font-weight: bold;
 
    background: #ffd843;
 
    background: -moz-linear-gradient(bottom, #fff, #ffd533);
 
    background: -webkit-linear-gradient(bottom, #fff, #ffd533);
 
    background: linear-gradient(to top, #fff, #ffd533);
 
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffd533', endColorstr='#ffffff', GradientType=0);
 
    border-bottom: 4px solid var(--light-green);
 
}
 

	
 
#supporters ul {