/* iRULE 2006 site CSS */

/*
 * Set up some HTML tag happiness. 
 */
body { font: small verdana; margin: 0; background-color: #fff; }
img { border: 0; }
table td { vertical-align: top; }
a { color: black; text-decoration: none; border-bottom: 1px solid #99a; }
form { padding: 0; margin: 0; }
th { text-align: center; }
h1, .h1 { font: normal 175% trebuchet MS, verdana, sans-serif; color: #23528c; margin: 4px 0 10px 0; padding: 0; }
h2, .h2 { font-size: 150%; font-weight: normal; margin: 8px 0; padding: 0; }
h3, .h3 { font-size: 100%; font-weight: bold; margin: 8px 0; padding: 0; }

/*
 * IDs and classes relating to the page template 
 */
#outside_container { background: url(/images/header_bg_tile.gif) repeat-x; text-align: center; }
#inside_container { width: 785px; margin: 0 auto; text-align: left; }
#title { background: url(/images/header.gif) no-repeat; height: 82px; }
#n-home { display: block; height: 82px; width: 780px; border: none; }

#menu ul { list-style: none; display: inline; }
#menu li { display: inline; }

.bar { background: url(/images/menu_cnr_r.gif) top right no-repeat #3a5178; margin: 0; padding: 0; }
.bar a { color: #cfd9e6; text-transform: uppercase; text-decoration: none; border: none; }
.bar a:hover { color: #fff; }
.bar .selected, body#blogs a#n-articles, body#shop a#n-shop, body#account a#n-account, body#community a#n-community, body#contact a#n-contact { color: #fff; font-weight: bold; }
.bar ul { background: url(/images/menu_cnr_l.gif) bottom left no-repeat; list-style: none; margin: 0; padding: 1px 0px 4px 10px; }
.bar ul li { display: inline; padding: 0 6px; }

#byline { float: right; width: 350px; text-align: right; font-size: 80%; color: #3b5279; padding: 10px 0 0 0 }

#content { margin-top: 10px; }

#footer { clear: both; background: url(/images/footer_bg_tile.gif) repeat-x; height: 50px; text-align: right; font-size: 80%; margin: 16px 0 0 0; padding: 3px 0; color: #23528c; }
#footer p { margin: 0 auto; width: 785px }

#home_promo { display:none; border: 1px solid #eaeaea; width: 493px; height: 300px; background: url(/images/home_main.jpg)}

div.animoto {
    width:432px;
    height:240px;
    margin-top:100px;
    margin-left:25px;
}

#rhs { width: 278px; float: right; color: #8c8c8c; font-size: 90%; }
#rhs p { padding: 0; margin: 0; }
#rhs p a { color: #8c8c8c; }

/*
 * iRULE-themed IDs and classes
 */
#noticebox { border: 1px solid #070; background-color: #ded; padding: 8px; margin: 8px 0 }
#errorbox { border: 1px solid #700; background-color: #edd; padding: 8px; margin: 8px 0 }
.contentbox { background-color: #eaeaea; border: 1px solid #eaeaea; margin: 0px 0px 15px 0px; padding: 7px }
.infobox { border: 1px solid #777; background-color: #ddd; padding: 8px; margin: 8px 0 }
.fieldWithErrors { display: inline }
.fieldWithErrors input { background-color: #fdd }
.helptext { font-size: 8pt }

/*
 * Convenience classes 
 */
.line, .npline, .sline { border-bottom: 1px solid #336 }
.line { margin: 24px 0 22px 0 }
.sline { margin: 20px 0 24px 0 }

ul.news { margin: 0; padding: 0; padding-left: 16px }
ul.news li { width: 350px }
a.hypo { text-decoration: none; border-bottom: 1px solid #bbb; color: black }
a.loud { font-weight: bold; }
a:hover.hypo, a:hover.loud { border-bottom: 1px solid #c10; }
a.noline { text-decoration: none; border: 0 }
a:hover.noline .hyperline { border-bottom: 1px solid #c10 }
#news ul { list-style: none }
#news li { padding-bottom: 4px }
input.doit { border: 1px solid #000; font-weight: bold; font-family: verdana; color: white; background-color: #226 }
input:hover.doit { border: 1px solid #c10 }
.onelineform { margin: 7px 0 0 0; }

.selbox, .selboxsel { border: 1px solid black; padding: 2px 4px; background-color: #ddd; color: #444; font-size: 85%; }
.selbox:hover { color: #c10; border-color: #c10; cursor: pointer }
.selboxsel { background-color: #c10; color: white }

table.groovy td, table.groovy th { padding: 4px 12px 4px 4px; vertical-align: middle }
tr.shade th { background-color: #ccc }
tr.shade1 td { background-color: #ddd }
tr.shade2 td { background-color: #eee }
tr.blueshade td { background-color: #ddf }
tr.greenshade td { background-color: #ded }
tr.redshade td { background-color: #fdd }
tr.final td { background-color: #bbb; font-weight: bold }
ul.vlist { list-style: none; margin: 0; padding: 0 }
ul.vlist li { margin: 0; padding: 2px 0 }
ul.vplist { list-style: none; margin: 0; padding: 0 }
ul.vplist li { margin: 0; padding: 8px 0 }
ul.hlist { list-style: none; display: inline }
ul.hlist li { padding-bottom: 4px; display: inline }
ul.comfortable li { padding-bottom: 4px; }
ol.comfortable li { padding-bottom: 8px; }
tr.strike td { text-decoration: line-through }

/*
 * iRULE-specific bits that are used between pages. 
 */
#wardrobe { width: 477px; border: 1px solid #eaeaea; border-top: 0; border-bottom: 0; padding: 16px 8px; height: 295px }
#iwant {display:none; width: 477px; border: 1px solid #eaeaea; border-top: 0; padding: 8px }

/*
*/
.abox { width: 64px; height: 64px; float: left; margin-right: 16px; }
.aboxcontent { border: 1px solid #eee; margin-left: 62px; min-height: 62px; padding-left: 24px; }
#a-racer { background: url(/images/rpoints_icon.gif) center 40% no-repeat #eee; }
.racericon { width: 20px; margin: 0 5px 0 0; border: 1px solid #ddd; background-color: #eee; padding: 2px;}
#a-newsletter { background: url(/images/newsletter_icon.gif) center 40% no-repeat #eee; }
#a-details { background: url(/images/user_icon.gif) center 30% no-repeat #eee; }

/*pagination stuff from will_paginate*/

  .pagination {
    padding: 3px;
    margin: 3px;
  }
  .pagination a {
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #aaaadd;
    text-decoration: none;
    color: #000099;
  }
  .pagination a:hover, .pagination a:active {
    border: 1px solid #000099;
    color: #000;
  }
  .pagination span.current {
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #000099;
    font-weight: bold;
    background-color: #000099;
    color: #FFF;
  }
  .pagination span.disabled {
    padding: 2px 5px 2px 5px;
    margin: 2px;
    border: 1px solid #eee;
    color: #bbb; /*was ddd but couldn't see it*/
  }
