/**************************************************************
   Top blue link bar
 **************************************************************/

#topbar {
  height: 2em;
  background: #EFADC8;
}

#topbarInner {
  width: 730px;
  height: 100%;
  margin: 0 auto;
  text-align: right;
  background: #EFADC8;
}

#topbar ul {
  margin: 0;
  padding: 0;
}

#topbar ul li {
  display: inline;
  margin: 0;
  padding: 0;
  list-style: none;
*/
}

#topbar ul li a {
  padding: 0 20px;
  color: #C24D79;
  font-weight: bold; 
   
}

#topbar ul li a:hover {
  color: #000;
  border: 0;
}


/**************************************************************
   Site Header image and logo
 **************************************************************/


#header { 
  height: 147px;
  font-size: 12px;
  background: #000 url(http://www.radfatties.com/images/header.jpg) no-repeat top center;
}

/* For search engine robots and no css display */
#header h1, 
#header h2 {
  display: none;
}

#header .signup {
  position: relative;
  z-index: 1;
  font-size: 12px;
  color: #FFF;
 }

#header .fade {
  position: relative;
  z-index: 1;

  height: 147px;
  width: 100%;
  
  background: url(http://www.radfatties.com/images/bg/header.gif) repeat-y top center; 
}

#header .fade img {
  margin: 0 auto;
}




/**************************************************************
   Interface layout classes - these create the white 
   rounded shape as well as the gradient background.
 **************************************************************/

#page {
  position: relative;
  z-index: 0;
  
  height: auto !important;
  height: 249px;
  
  background: url(http://www.radfatties.com/images/thinbackground.jpg) repeat-y top center;
}

#page .fade {
  position: absolute;
  z-index: 1;
  top: 0;
  left: 0;

  height: 249px;
  width: 100%;
  
  background: url(http://www.radfatties.com/images/sideback.jpg) repeat-x top left;  
}

#page #fadeEdges {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;

  height: 249px;
  width: 100%;  
  background: url(http://www.radfatties.com/images/bigbackground.jpg) no-repeat top center; 
}

#page #content {
  position: relative;
  text-align: left;
  z-index: 3;
  width: 729px;
  margin: 0 auto;
  background: #FFF; 
}


#page img {
  margin: 0 auto;
}



/**************************************************************
   Main Menu at the top
 **************************************************************/

/* Default, 4 items */
ul.topMenu {
  margin: 0 11px;
  padding: 0; 
}

ul.topMenu li {
  display: inline;
  margin: 0;
  padding: 0;
  list-style: none;
*/
}

ul.topMenu li a {
  float: left;
  position: relative;
  width: 159px;
  
  margin-right: 10px;  
  padding: 5px;
  line-height: 120%;  
  
  background: none;
  border-bottom: 0;
} 

ul.topMenu li a.last {
  margin: 0 0 0 1px !important;
  margin: 0 0 0 2px;
}

ul.topMenu li a:hover {
  padding-bottom: 5px;
  background: #EEE;
  border-bottom: 0;
}
 
ul.topMenu li a.here,
ul.topMenu li a.here:hover {
  padding-bottom: 5px;
  background: #EBF1F5;
  border-bottom: 0;
}

ul.topMenu li a span.title {
  display: block;
  position: relative;
  z-index: 1;
  font: 700 1.4em 'Lucida Grande', Arial, Helvetica, Verdana, sans-serif; 
  color: #69889E;
}

ul.topMenu li a:hover span.title,
ul.topMenu li a.here span.title {
  color: #334F63;
}

ul.topMenu li a span.desc {
  font: 400 1em 'Lucida Grande', Arial, Helvetica, Verdana, sans-serif;
  color: #666;
}

ul.topMenu li a:hover span.desc,
ul.topMenu li a.here span.desc {
  color: #333;
}

ul.topMenu li a span.top {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 172px;
  height: 9px;  
}

ul.topMenu li a:hover span.top {
  background:;
}

ul.topMenu li a.here span.top {
  background:;
}


/* 3 Item Menu */
.three ul.topMenu li a {
  width: 219px;
  margin-right: 10px;
} 

.three ul.topMenu li a.last {
  margin: 0 0 0 1px !important;
  margin: 0 0 0 2px;
}

.three ul.topMenu li a:hover {
  background: #EEE;
}
 
.three ul.topMenu li a.here,
.three ul.topMenu li a.here:hover {
  background: #EBF1F5;
}

.three ul.topMenu li a span.top {
  width: 232px;
}

.three ul.topMenu li a:hover span.top {
}

.three ul.topMenu li a.here span.top {
}


/* 5 Item Menu */
.five ul.topMenu li a {
  width: 123px;
  margin-right: 10px;
} 

.five ul.topMenu li a.last {
  margin: 0 0 0 1px !important;
  margin: 0 0 0 2px;
}

.five ul.topMenu li a:hover {
  background: #EEE url(../images/bg/menu_bottom_gray_5.gif) no-repeat bottom left;
}
 
.five ul.topMenu li a.here,
.five ul.topMenu li a.here:hover {
}

.five ul.topMenu li a span.top {
  width: 172px;
}

.five ul.topMenu li a:hover span.top {
}

.five ul.topMenu li a.here span.top {
}




/**************************************************************
    Container for the columns.  If using a side menu, it 
    should be placed inside a #sideBar container.
 **************************************************************/

#columns {
  position: relative;
}



/**************************************************************
   Fixed width side bar
 **************************************************************/

#sideBar {
 
  position: relative; /* needed to stop IE from destroying the sideMenu */
  float: right;  
  width: 130px;
  margin: 15px 12px 0 0 !important;
  margin: 15px 6px 0 0;
  line-height: 120%;
}

/**************************************************************
   Side menu
 **************************************************************/

ul.sideMenu {
  margin: 0;
  padding: 0;    
}

ul.sideMenu li {
  margin: 0;
  padding: 0;
  list-style: none;
*/
}

ul.sideMenu li a {
  display: block;
  position: relative;
  width: 130px; /* Needed to stop IE hover flicker */
  margin-bottom: 15px;  
  padding: 5px;
  background: none;
  border-bottom: 0;
} 

ul.sideMenu li a:hover {
  padding: 5px;
  border-bottom: 0;
  background: #FAE1F6;
}

ul.sideMenu li a.here,
ul.sideMenu li a.here:hover {
  background: #FAE1F6;
}

ul.sideMenu li a span.title {
  position: relative;
  z-index: 1;
  display: block;
  font: 700 1.4em 'Lucida Grande', Arial, Helvetica, Verdana, sans-serif; 
  color: #C24D79;
}

ul.sideMenu li a:hover span.title,
ul.sideMenu li a.here span.title {
  color: #334F63;
}

ul.sideMenu li a span.desc {
  color: #666;
}

ul.sideMenu li a:hover span.desc,
ul.sideMenu li a.here span.desc {
  color: #333;
}

ul.sideMenu li a span.top {
  position: absolute;
  z-index: 0;
  top: 0;
  left: 0;
  width: 172px;
  height: 9px;  
}

ul.sideMenu li a.here span.top,
ul.sideMenu li a.here:hover span.top {
}

ul.sideMenu li a:hover span.top {
}




/**************************************************************
   Footer and sub-footer
 **************************************************************/

#footer { 
  clear: both; /* CHANGED */
  margin: 0 0 0 1.5em;
  padding-top: 2.5em;
  font-size: 0.9em;
  color: #ACACAC;
  line-height: 120%;
}

#footer ul {
  float: right;
  margin: 0;
  padding: 0;
}

#footer ul li {
  display: inline;
  margin: 0;
  padding: 0 7px;
  list-style: none;
*/
  border-right: 1px solid #CCC;
}

#footer ul li.last {
  border: 0;
  padding-right: 12px;
}

#subFooter {  
  clear: both;  
  font-size: 0.9em;
  z-index: 10;
  color: #999;
  background: #EFADC8;
  line-height: 120%;
  padding-top: 0.5em
}

#subFooterWidth {
  margin: 0 auto;  
  width: 730px;
  text-align: left;
}

#subFooterWidth .left {
  float: left;
  width: 45%;
  padding: 0 0 1em 1em;
}

#subFooterWidth .right {
  float: right;
  width: 45%;
  padding: 0 0.75em 1em 0;
  text-align: right;  
}


/**************************************************************
   Width classes 
 **************************************************************/

.width100 {
  width: 100%;
}

.width90 {
  width: 90%;
}

.width75 {
  width: 75%;
}

.width66 {
  width: 65.7%;
}

.width50 {
  width: 49.7%;
}

.width33 {
  width: 32.7%;
}

.width25 {
  width: 24.7%;
}

.width {
  width: 730px;
}





/**************************************************************
   Alignment classes
 **************************************************************/

.floatLeft {
  float: left;
}

.floatRight {
  float: right;
}

.alignLeft {
  text-align: left;
}

.alignRight {
  text-align: right;
}


/**************************************************************
   Icons
 **************************************************************/

.whitePhone {
  padding-left: 22px;
  background-position: 0 10px;
}

.whiteCheck {
  margin-top: 10px;
  padding-left: 22px;
  background-position: 0 10px;
}

.blueExclamation {
  padding-left: 37px;
  background-position: 0 50%;
}




/**************************************************************
   Generic display classes
 **************************************************************/

.clear {
  clear: both;
}

.block {
  display: block;
}

.bold {
  font-weight: bold;
}

.small {
  font-size: 0.8em;
}

.big {
  font-size: 1.2em;
}

.bigger {
  font-size: 1.3em;
}

.blue {
  color: #537790;
  font-weight: bold;
}

.center {
  text-align: center;
}

#listitems ul li {
 padding-bottom: 10px;
}

#map {
  margin-left: 10px;  
  border: thin solid gray; 
}
