/* This CSS file is used in all 9 of the free simple templates at         */
/* www.bravenet.com.  Feel free to look at the templates themselves       */
/* to get an idea of how the various classes listed here can combine      */
/* to produce a wide variety of layouts.  (Classes are the entries        */
/* beginning with a '.')                                                  */

/* Note: The slash star combinations surround text that is to be          */
/*       marked a comment.  These just describe the CSS and are           */
/*       ignored by the browser.                                          */

body {
 margin: 0;
 padding: 0;
 font-size: 18px; font-family: Tahoma, Arial;
 background-image: url('../img/background.png');
}

/* these are the font styles for the links that appear on your web page */
a:link    { font-size: 18px; font-family: Tahoma, Arial; color: #00529b; text-decoration: underline;} 
a:active  { font-size: 18px; font-family: Tahoma, Arial; color: #00529b; text-decoration: underline;}
a:visited { font-size: 18px; font-family: Tahoma, Arial; color: #00529b; text-decoration: underline;}
a:hover   { font-size: 18px; font-family: Tahoma, Arial; color: #00529b; background-color: #ffcf06; text-decoration: underline;}

a.footer:link    { font: bold 12px Tahoma, Arial; color: #ffcf06; text-decoration: none;} 
a.footer:active  { font: bold 12px Tahoma, Arial; color: #ffcf06; text-decoration: none;}
a.footer:visited { font: bold 12px Tahoma, Arial; color: #ffcf06; text-decoration: none;}
a.footer:hover   { font: bold 12px Tahoma, Arial; color: #00529b; background-color: #ffcf06; text-decoration: none;}

a.menu:link    {
 font: bold 13px Tahoma, Arial;
 color: #ffcf06;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #00529b;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}
a.menu:active  {
 font: bold 13px Tahoma, Arial;
 color: #ffcf06;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #00529b;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}
a.menu:visited {
 font: bold 13px Tahoma, Arial;
 color: #ffcf06;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #00529b;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}
a.menu:hover   {
 font: bold 13px Tahoma, Arial;
 color: #00529b;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #ffcf06;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}

a.menu_xmas:link    {
 font: bold 13px Tahoma, Arial;
 color: #f00;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #0f0;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}
a.menu_xmas:active  {
 font: bold 13px Tahoma, Arial;
 color: #f00;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #0f0;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}
a.menu_xmas:visited {
 font: bold 13px Tahoma, Arial;
 color: #f00;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #0f0;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}
a.menu_xmas:hover   {
 font: bold 13px Tahoma, Arial;
 color: #0f0;
 text-decoration: none;
 display: block;
 width: 130px;
 background-color: #f00;
 border: solid 1px #000;
 padding: 2px;
 margin-bottom: 3px;
}

.border {
 /* this is used for all kinds of borders */
 /* be it for the whole page, or just the content section */
 border: solid 1px #00529b;
}

.left {
 /* floats the item to the left side of the page, and adds a margin */
 float: left;
}

.right {
 /* floats the item to the right side of the page, and adds a margin */
 float: right;
}

.scroll {
 /* this makes the element create scroll bars if the text is too long */
 /* to be displayed.  This is very similar to the effect created by */
 /* frames and iframes, but does not allow page transitions like frames do */
 overflow: auto;
}

.wrapper {
 /* remove this to have the page load at full width */
 width: 900px;
 margin: 10px auto;
 background-image: url('../img/backing.png');
 background-repeat: repeat-y;
 border-left: 1px solid #009;
 border-right: 1px solid #009;
}

.title {
 /* this is the styling for the title.  Semantically, this should be an h1 */
 /* padding all four sides of the div in order top, right, bottom, left */
 background-color: #00529b;
 border: solid 1px #00529b;
 color: #ffcf06;
 font-face: Tahoma, Arial;
 font-weight: bold;
 font-size: 36px;
 padding: 10px 20px 10px 20px;
}

.title2 {
 color: #ffcf06;
 font-face: Tahoma, Arial;
 font-weight: bold;
 font-size: 18px;
}

.titlemargin {
 margin: 0px 0px 0px 0px;
}

.subtitle {
 color: #00529b;
 font-face: Tahoma, Arial;
 font-weight: bold;
 font-size: 14px;
}

.content {
 /* this describes the container of the content paragraphs. */
 padding: 0px 20px 0px 20px; /* keeps text off the borders */
 font-face: Tahoma, Arial;
 font-size: 18px;
 color: #00529b;
 padding: 0px;
 margin: 10px;
}

.content.padleft {
 /* this is to pad if there's a sidebar on the left */
 padding-left: 180px;
}

.content.padright {
 /* this is to pad if there's a sidebar on the right */
 padding-right: 180px;
}

.sidebar {
 width: 150px;
 height: 100%; /* remove this to allow different-sized sidebars */
 background-color: #ddd;
 color: #00529b;
 font-weight: bold;
 padding: 10px 0px 5px 0px;
}

.sidebaritem {
 width: 130px;
 background-color: #00529b;
 color: #cc3;
 border: solid 1px #000;
 font-size: 14px;
 padding: 2px;
 margin-bottom: 3px;
}

.sidebaritemcurrent {
 width: 130px;
 display: block;
 background-color: #ff9;
 color: #00529b;
 border: solid 1px #000;
 font: bold 13px Tahoma, Arial;
 padding: 2px;
 margin-bottom: 3px;
}

.horiz {
 color: #4B1A95;
 font-weight: bold;
 width: 124px;
 float: left;
 text-align: center;
}

.sidebaritem.first {
 margin-top: 10px;
}

.footer {
 background-color: #00529b;
 color: #ffcf06;
 font-size: 12px;
 font-face: Tahoma, Arial;
 text-align: center;
 padding: 5px 0;
}