/* style.css */

/*** Define global layout ***/

/* Make browsers always show the vertical scrollbars so menu doesn't move       */
/* See http://webdevel.blogspot.com/2007/05/controlling-browser-scrollbars.html */

html {overflow-y: scroll;}

body {
/*  background: #EDEDED; */
  background-image: url('/images/marble-dark.jpg');
  background-repeat: repeat;
  /* Workaround for weird IE margin problem */
  margin: 0px auto;
  color: black;
}

/*** Define general page layout ***/

#container {
/*  background: #EDEDED; */
  background-image: url('/images/marble-light.jpg');
  background-repeat: repeat;
  border: 3px solid black;
/*  font-size: 13px; */
  width: 894px;
  margin: 20px auto;
  text-align: center;
/*  line-height: 16px; */
  font-family: helvetica, arial, sans-serif;
}

#header {
/*  background: #EDEDED; */
/*  height: 800px; */
  color: black;
}

#content {
/*  background: #EDEDED; */
/*  height: 800px; */
  color: black;
}

#footer {
/*  background: #EDEDED; */
  background-image: url('/images/marble-medium.jpg');
  background-repeat: repeat;
/*  height: 30px; */
  color: black;
}

/*** Define box classes ***/

.clearbox {
  color: black;
}

.redbox {
  background: #D4121A;
  color: white;
}

.whitebox {
  background: white;
  color: black;
}

.bluebox {
  background: #002A5A;
  color: white;
}

.blackbox {
  background: black;
  color: white;
}

.graybox {
  background: #D3D3D3;
  color: white;
}

.yellowbox {
  background: yellow;
  color: black;
}


/*** Define text colors, text styles, font sizes, and text alignment ***/

.redtext {color: #D4121A;}
.bluetext {color: blue;}
.whitetext {color: white;}
.graytext {color: gray;}
.blacktext {color: black;}

.normal {font-style: normal;}
.italic {font-style: italic;}
.bold {font-weight: bold;}
.underline {text-decoration: underline;}

.size48px {font-size: 48px;}
.size44px {font-size: 44px;}
.size40px {font-size: 40px;}
.size36px {font-size: 36px;}
.size32px {font-size: 32px;}
.size28px {font-size: 28px;}
.size24px {font-size: 24px;}
.size22px {font-size: 22px;}
.size20px {font-size: 20px;}
.size18px {font-size: 18px;}
.size16px {font-size: 16px;}
.size14px {font-size: 14px;}
.size12px {font-size: 12px;}
.size11px {font-size: 11px;}
.size10px {font-size: 10px;}
.size9px  {font-size: 9px;}
.size8px  {font-size: 8px;}

.textleft {text-align: left}
.textcenter {text-align: center}
.textright {text-align: right}
.textjustify {text-align: justify}


/*** Define horizontal menu id ***/

#menu {
/*  background: #D3D3D3; */
  background-image: url('/images/marble-medium.jpg');
  background-repeat: repeat;
  float: left;
  list-style: none;
  margin: 0px;
  padding: 0px;
  width: 100%;
}

#menu li {
/*  background: #D3D3D3; */
  float: left;
  height: 21px;
  margin: 0px;
  padding: 0px;
 /* For debug only
  border-width: 1px;
  border-color: white;
  border-style: solid; */
}

#menu a {
  color: #484848;
  font-size: 12px;
  font-weight: bold;
  display: block;
  margin: 0px 5px;
  padding: 3px 0px 2px;
  text-decoration: none;
  height: 16px;
}

#menu a:hover,
body#home a#homenav:hover,
body#services a#servicesnav:hover,
body#directions a#directionsnav:hover,
body#specials a#specialsnav:hover,
body#webcam a#webcamnav:hover,
body#about a#aboutnav:hover {
  color: black;
  font-size: 14px;
  padding: 2px 0px 3px;
}

body#home a#homenav,
body#services a#servicesnav,
body#directions a#directionsnav,
body#specials a#specialsnav,
body#webcam a#webcamnav,
body#about a#aboutnav {
  color: white;
  background: #969696;
  font-size: 14px;
  padding: 2px 0px 3px;
}