/* File:      hphc3.css
   Author:    Howard Gibson
   Date:      2025-10-17
   Project:   High Park Hiking Club
   Language:  W3C CSS2.1
   
   Colour Schemes (search and replace)

   Light background...
     background:  white;
     text:        #004000;
     link:        #008000;
     visited:     #006000;
     active:      #800000;

   dark background...
     background:  #003000;
     text:        #bbbbbb;
     link:        white;
     visited:     #dddddd;
     active:      #800000;
*/

body {
  background:  white;
  color:  black;
  max-width:  80em;
}
body a:link    {color:  #008000;}
body a:visited {color:  #006000;}
body a:active  {color:  #800000;}

.Logo {
  float:  right;
  border:  0;
  border-width:  0;
  border-color:  white;
  margin-bottom:  1em;
}

h1 {
  text-align:  left;
}

h2 {
  clear:  left;
}

p {
  text-indent:  1em;
}

hr {
  clear:  both;
}

div.insert {
  width:  360px;
  float:  right;
  border-width: 2px;
  border:  #003000;
}
div.insert p {
  margin-left:  1em;
  margin-right:  1em;
}

.left {
  float:  left;
  clear:  left;
  margin-top:  0.5em;
  margin-right:  0.5em;
  margin-bottom:  0.5em;
}

.right {
  clear:  right;
  float:  right;
  margin-top:  0.5em;
  margin-left:  1em;
  margin-bottom:  0.5em;
}

a img {
  border:  thin solid white;
}

table th {
  vertical-align:  bottom;
}
table td {
  vertical-align:  top;
}

table.schedule {
  clear:  both;
  width:  100%;
}
table.schedule tr.Info {
  font-style:  italic;
}
table.schedule th {
  text-align:  left;
}
table.schedule tr.reference {
}
table.schedule tr.reference td {
  background:  #ddffdd;
}

p.info {
  text-indent:  0;
}

table.hikedata {
  border-top:  thin solid green;
  border-left:  thin solid green;
  border-right:  medium solid green;
  border-bottom:  medium solid green;
  padding: 0.5em;
}

p.hyperlink {
  text-indent:  0;
}

table.footer {
  clear:  both;
  width:  100%;
}

p.label {
  text-indent:  0;
  font-style:  italic;
}

p.photos {
  text-align:  center;
  text-indent:  0em;
}

p.caption {
  border-top:  thin solid black;
  text-align:  center;
}

dl dt {
  clear:  left;
}

p.signature {
  text-indent:  0;
  text-align:  right;
  font-style:  italic;
}

.warning {
  color: #a00000;
  font-style:  italic;
}

.warning em {
  color:  #400000;
  font-weight:  bold;
}

.oops {
  text-decoration:  line-through;
}

p.correction {
  text-indent:  0;
  border-top:  0.1em;
  border-right:  0.1em;
  border-left:  0.1em;
  border-bottom:  0.1em;
  border-color:  #004000;
  border-style:  solid;
  font-size:  110%;
  /*margin:  1em;*/
  padding:  0.5em;
}

blockquote {
  background: #efefff;
  padding:  0.5em;
  border:  thin solid black;
  padding-top:  0.2em;
  padding-bottom:  0.2em;
}

table.numbers {
}
table.numbers .Emphasized {
  font-weight:  bold;
}
table.numbers td {
  text-align:  right;
}
table.numbers td.NotNum {
  text-align:  left;
}
table.numbers td.Heading {
  text-align:  left;
  font-weight:  bold;
}

.ClearRight {
  clear:  right;
}

@media screen {
  body {
    color:  #004000;
  }
  ul.Main {
    clear:  right;
    float:  right;
    width:  18em;
    font-weight:  bold; 
    margin-top:  0.5em;
    margin-left:  0;
  }
  ul.Main li {
    list-style-type:  none;
    list-style-position:  outside;
    background:  #f0f0d0;
    border-bottom:  thin solid #808040;
    border-right:  thin solid #808040;
    margin-top:  0;
    margin-bottom: 0.3em;
    line-height:  1.5em;
    padding-right:  1em;
    padding-left:  1em;
    font-size:  120%;
    font-family:  sans-serif; 
  }
  ul.Main li:hover {
    background:  #f8f8e0;
    border-bottom:  thin solid #a0a080;
    border-right:  thin solid #a0a080;
  }
  ul.Main li a {text-decoration:  none;}
  ul.Secondary {
    line-height:  1.6em;
    font-weight:  bold; 
    font-family:  sans-serif; 
    padding-left:  0;
  }
  ul.Secondary li {
    list-style-type:  none;
    list-style-position:  outside;
    display: inline;
    line-height:  2.2em;
    background:  #f0f0d0;
    border-bottom:  thin solid #808040;
    border-right:  thin solid #808040;
    margin-top:  0.5em;
    margin-bottom: 0.5em;
    padding-top:  0.2em;
    padding-bottom:  0.2em;
    padding-right:  0.4em;
    padding-left:  0.4em;
    font-family:  sans-serif; 
  }
  ul.Secondary li:hover {
    background:  #f8f8e0;
    border-bottom:  thin solid #a0a080;
    border-right:  thin solid #a0a080;
  }
  ul.Secondary li a {
    text-decoration:  none;
  }
  div.toc {
  }
  div.toc li {
      font-size:  120%;
  }
  /*
  div.toc li a {
    text-decoration:  none;
  }
  */
  ul.Secondary li:hover {
  }
  table.schedule td {
    background:  #eeeeff;
  }
  table.footer td {
     background:  #003000;
     color:  #bbbbbb;
     text-align:  center;
  }
  table.footer a:link    {color:  #ffffff;}
  table.footer a:visited {color:  #dddddd;}
  table.footer a:active  {color:  #800000;}
}

/*@media only screen and (max-resolution:  99dpi) {*/
@media screen and (min-device-width:  640px) {
  body {
    background:  white url("FallBorder.jpeg"); 
    /* background:  white url("WinterBorder.jpeg");  */
    /* background:  white url("SpringBorder.jpeg"); */
    background-repeat:  repeat-y;
    margin-left:  100px;
  }
}

/*@media only screen and (min-resolution:100dpi) {*/
@media screen and (max-device-width:  639px) {
  body {
    background:  white; 
    /*font-size: 150%;*/
  }
  ul.Main {
    clear:  both;
    float:  none;
    width:  100%;
  }
  ul.Main li {
    text-align:  center;
    line-height:  2em;
  }
  ul.Secondary {
    margin-bottom:  1em;
  }
  ul.Secondary li {
    line-height:  2em;
  }
  table.schedule {
    line-height:  2em;
  }
}

@media handheld {
  ul.Main {
  }
  ul.Main li {
    list-style-type:  none;
    list-style-position:  outside;
    background:  #f0f0d0;
    border-bottom:  thin solid #808040;
    border-right:  thin solid #808040;
    margin-top:  0.5em;
    margin-bottom: 0.5em;
    padding-right:  1em;
    padding-left:  1em;
    font-size:  120%;
    font-family:  sans-serif; 
  }
  ul.Secondary {
    list-style-type:  none;
    list-style-position:  outside;
    line-height:  2.2em;
    background:  #f0f0d0;
    border-bottom:  thin solid #808040;
    border-right:  thin solid #808040;
    margin-top:  0.5em;
    margin-bottom: 0.5em;
    padding-top:  0.2em;
    padding-bottom:  0.2em;
    padding-right:  0.4em;
    padding-left:  0.4em;
    font-family:  sans-serif; 
  }
}

@media print {
  h1, h2, h3 {color:  #004000;}
  ul.Main {
    display:  none;
  }
  ul.Secondary {
    display:  none;
  }
  p.hyperlink {
    display:  none;
  }
  div.toc {
    display:  none;
  }
  table.schedule {
    border:  thin solid #004000;
  }
  table.footer {
    border:  none;
    border-top:  medium solid #040000;
  }
  table.footer td {
    text-align:  center;
    margin-right:  1em;
    margin-left:  1em;
  }
  table.schedule tr.reference td {
    font-weight:  bold;
  }
}
