/* Style sheet for my website.
 *
 * Copyright (C) 2005-2009 Jonathan duSaint under the terms of the
 * GNU General Public License v2.1
 */

body {
  background-color: #aad0c8;
  color:            black;
  margin:           0px;
}

div.navigate {
  text-align:       center;
  background-color: #bae0d8;
  color:            black;
  position:         fixed;
  float:            left;
  top:              0%;
  bottom:           0%;
  left:             1%;
  width:            126px;
  height:           100%;
  border-top:       0;
  border-right:     2px solid #b2d8d0;
  border-bottom:    0;
  border-left:      0;
}

div.main {
  background-color: transparent;
  margin:           2px 10px 2px 196px;
}

div.validated {
  background-color: transparent;
  position:         fixed;
  clear:            both;
  float:            left;
  left:             2%;
  bottom:           0;
}

div.form {
  background-color: #aad0c8;
  color:            black;
  text-align:       center;
  border-right:     1px solid #a2c8c0;
  border-bottom:    1px solid #a2c8c0;
}


/* normal links */
a {
  text-decoration:  none;
  background-color: #aad0c8;
  color:            blue;
}

a:hover {
  text-decoration:  underline;
  background-color: #aad0c8;
  color:            black;
}

/* navigation links - much more interesting */
.navigate a {
  display:          block;
  width:            110%;
  border-left:      1px solid #8ab0a8;
  border-top:       1px solid #8ab0a8;
  border-right:     2px solid #7aa098;
  border-bottom:    2px solid #7aa098;
  text-decoration:  none;
  background-color: #bae0d8;
  color:            black;
  margin:           5px;
}

.navigate a:hover {
  display:          block;
  width:            110%;
  border-left:      1px solid #8ab0a8;
  border-top:       1px solid #8ab0a8;
  border-right:     2px solid #7aa098;
  border-bottom:    2px solid #7aa098;
  text-decoration:  none;
  background-color: #bae0e8;
  color:            black;
  margin:           5px;
}

.navigate a:active {
  display:          block;
  width:            110%;
  border-left:      1px solid #8ab0a8;
  border-top:       1px solid #8ab0a8;
  border-right:     2px solid #7aa098;
  border-bottom:    2px solid #7aa098;
  text-decoration:  none;
  background-color: #e8f8e8;
  color:            black;
  margin:           5px;
}

.navigate div.current {
  display:          block;
  width:            110%;
  border-left:      1px solid #8ab0a8;
  border-top:       1px solid #8ab0a8;
  border-right:     2px solid #7aa098;
  border-bottom:    2px solid #7aa098;
  background-color: #d9fff7;
  color:            black;
  margin:           5px;
}

/* the links for valid XHTML/CSS icons */
.validated a {
  display:          block;
  border:           none;
  margin:           0;
  /*background-color: #bae0d8;*/
  background-color: transparent;
  /*color:            black;*/
}


/* normal images */
img {
  border:           2px solid #7aa098;
  margin:           0.5em;
}

/* the logo at the top left */
img.logo {
  border:           none;
}

/* the W3C valid XHTML/CSS buttons */
.validated img {
  border:           none;
}

/* left and right floated images - used in body text */
img.left {
  border:           2px solid #7aa098;
  margin:           0.5em;
  float:            left;
}

img.right {
  border:           2px solid #7aa098;
  margin:           0.5em;
  float:            right;
}


/* form elements */

input.button {
  border:           1px solid black;
  text-align:       center;
  background-color: #aad0c8;
  color:            black;
}

input.button:hover {
  background-color: #bad0d8;
  color:            black;
}


.main h2 {
  display:          block;
  background-color: #b2d8d0;
  color:            black;
}

/* climbing page */

p.fa {
  font-size:        small;
}
p.fa:before {
  font-size:        small;
  content:          "F.A. ";
}

span.route {
  font-style:             italic;
}

@media print {
  body {
    background:     white;
    color:          black;
    font-size:      10pt;
  }

  div.main {
    margin-top:     0.5in;
    margin-bottom:  0.5in;
    margin-left:    0.25in;
    margin-right:   0.25in;
  }

  div.navigate {
    display:        none;
  }

  div.validated {
    display:        none;
  }

  a {
    font-weight:    bold;
  }

  div.main a:after {
    content:        " (" attr(href) ") ";
    font-size:      90%;
  }
}
