/*
  Hi, smart people!
  Thanks for being interested in my CSS.
  Copying the CSS is allowed as long as your site does not look
  TOO similar to mine. I'm not a prof. web developer, though,
  so you better find some gurus and learn from them :)

  !! Currently it is only a "beta-version": not tidy, etc.
*/

html, body {
  margin: 0;
  padding: 0;
  border: 0;
}

body {
  color: #000;
  background-color: #fefefe;

  font-family: verdana, arial, helvetica, sans-serif;
  font-size: 0.8em;
  line-height: 1.5em;
  text-align: center;
}

#main-container {
  margin: 0px auto;
  padding: 0px;
  padding-bottom: 25px;
  width: 620px;

  background: #fefefe;

  text-align: left;
}

#header {
  margin: 0px;
  padding: 0px;
  width: 620px;
  height: 195px;

  background-image: url(images/theme/TL_prairieShack.jpg);
  background-repeat: no-repeat;
  background-color: #000000;
}

#lang-selector {
  float: right;

  margin: 0px;
  padding: 7px 12px 0px 0px;

  color: #ffe747;
  font-weight: bold;
}

#lang-selector a {
  color: #ffe747;
}

#lang-selector a:hover {
  color: #fbffa2;
}

#maintop {
  margin: 0px;
  padding: 0px;
  height: 16px;
  width: 450px;

  background-image: url(images/theme/main_text_top_edge.gif);
  background-repeat: no-repeat;

  font-size: 0px;  /* Against an IE bug */
}

#main-text {
  float: left;

  margin: 0px;
  padding: 0px;
  width: 450px;

  background-image: url(images/theme/main_text_background.gif);
  background-repeat: repeat-y;
  background-color: #ecf5e9;
}

#mainbottom {
  margin: 0px;
  padding: 0px;
  height: 16px;
  width: 450px;

  background-image: url(images/theme/main_text_bottom_edge.gif);
  background-repeat: no-repeat;

  font-size: 0px;  /* Against an IE bug */
}

#right-menu {
  float: right;

  margin: 0px;
  padding: 0px;
  width: 170px;

  background-image: url(images/theme/right_menu_background.gif);
  background-repeat: repeat-y;
  background-color: #ab7;
}

.menuitem {
  margin: 0;
  padding: 0.25em 0.75em;

  border-bottom: 1px dashed #9a6;
  color: #3a7338;
  font-weight: bold;
}

.submenuitem {
  padding: 0.25em 1.05em;
  text-align: right;
}


#right-menu a:hover {
  background-image: url(images/theme/right_menu_menuitem_hover.gif);
  background-repeat: repeat-y;
  background-color: #cead5e;

  color: #223399;
}

/*
   I made menuitem-current a class instead of an id, because
   I can't give two id's to a single element and I am using
   id="menuitem-last" for the last element in menu.
*/
.menuitem-current {
  background-image: url(images/theme/right_menu_menuitem_current.gif);
  background-repeat: repeat-y;
  background-color: #a3b995;

  color: #ecf5e9;
}

#menuitem-last {
  border-bottom: 0px;
}

#menubottom {
  float: left;

  margin: 0px;
  padding: 0px;
  height: 8px;
  width: 170px;

  background-image: url(images/theme/right_menu_bottom.gif);
  background-repeat: no-repeat;

  font-size: 0px;  /* Against an IE bug */
}

h1 {
  margin: 0px;
  margin-top: 10px;
  margin-bottom: 14px;

  font-size: 1.4em;
  font-weight: bold;
  text-align: center;
  color: #239;
}

h2 {
  margin: 10px 24px 0px 25px;

  font-size: 1.3em;
  font-weight: bold;
  color: #33732D;
}

p {
  margin: 15px 24px 15px 25px;
  padding: 0px;
}

ul {
  margin: -12px 40px 15px 25px;
}

a {
  text-decoration: none;
  color: #1040d4;
}

a:hover {
  color: #9922dd;
}

strong {
  color: #001000;
}

.centered-image-gradientedge {
  display: block;
  margin: 0px auto;
}

.centered-image-smallmargin {
  display: block;
  margin: auto;
  margin-top: 1px;
}

.centered-image-clearedge {
  display: block;
  margin: auto;
  margin-top: 30px;
}

.centered-text {
  text-align: center;
}

.hanging-indent {
  display: block;
  padding-left: 1.8em;
  text-indent: -1.35em;
}

/* Clearfix forces it's container's bottom edge down if floats
   in it are made taller (i.e. it avoids floats hanging over
   the bottom edge).
*/
.clearfix:after {
    content: "."; 
    display: block; 
    position:relative; /*works better in IE5.5 or float in float situations*/
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix {display: inline-table;}

/* Hides from IE-mac */
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

.smallreference {
  font-size: .7em;
}

.smallreference a {
  color: #4c6d7a;
}

.smallreference a:hover {
  color: #4c9d7a;
}

#whoAmILine {
  font-weight: bold;
  text-align: center;
  color: #882277;
}

/*
 Used only on the front page.
*/

#myphoto-tilted {
  display: block;  /* Otherwise img would be inline and align like text */
  margin: 30px auto 0px auto;
  padding: 0px;
}

#bigname {
  margin: 0px;
  margin-top: 15px;

  font-size: 2.2em;
  font-weight: bold;
  text-align: center;
  color: #2c5d8a;
}

#e-mail {
  margin: 0px;
  margin-top: 15px;
  margin-bottom: 15px;

  font-size: 1.5em;
  font-weight: bold;
  text-align: center;
  color: #2c5d8a;
}

#frontpagelink {
  margin: 0px;
  margin-top: 15px;
  margin-bottom: 15px;

  font-weight: bold;
  text-align: center;
}

/*
 Used only on the Who am I? page.
*/

#photo-ontherock {
  display: block;  /* Otherwise img would be inline and align like text */
  margin: 10px 22px 0px auto;
  padding: 0px;
}

/*
 Used only on the Photogalleries page.
*/

.linkattention {
  color:#F7A29A;
  font-weight:bold;
  text-decoration:line-through;
}

/*
 Used only on the Site Info page.
*/

.thumbrow {
  margin: 0px;
  padding: 0px;
  width: 450px;
}

.thumb {
  float: left;

  margin: 0px;
  padding: 10px 0px 10px 25px;
  width: 100px;
}

.thumbtext {
  float: left;

  margin: 0px;
  padding: 10px;
  width: 280px;
}

.hugelink {
  margin: 0px;
  padding: 0px 0px 15px 0px;

  font-weight: bold;
  font-size: 1.5em;
  text-align: center;
}

.snlink {
  margin: 0px;

  font-weight: bold;
  font-size: 1.2em;
  text-align: center;
}


.no-top-padding {
  margin: 0px 24px 15px 25px;
  padding: 0px;
}

.menu-software {
  color: #3a73aa;
}

.menu-barriergamelink {
  color: #3a77e8;
}