html { background: #fff url(../img/bg_html.jpg) center 0 repeat-x; }
body { margin: 0; min-height: 700px; background: transparent url(../img/bg_body.jpg) center 0 no-repeat; color: #111; }
/* Min-height for IE6 */
* html body { height: 700px; }
div.container,
#header,
#content,
#footer { position: relative; z-index: 1; }
/* Main image offset = 107px */
#logo { position: absolute; top: 0; left: 40px; z-index: 100; width: 183px; height: 176px; }
#navigation { width: 480px; position: absolute; right: 24px; top: 51px; z-index: 100; overflow: visible; }
#content { margin-top: 107px; }
#content div.error-404 { background: #f3f3f3; border: solid 1px #ccc; margin: 100px auto 120px; padding: 2em; font-size: 1.4em; line-height: 1.4em; color: #444; }
#content div.header { margin-top: 20px; margin-bottom: 10px; }
#content div.header div.box { text-align: center; line-height: 1; overflow: visible; }
#content div.header img { margin-top: -16px; }
#content div.box { border: solid 1px #ccc; background: #f3f3f3; overflow: hidden; }
#content div.box .banner { height: 40px; margin: 0; padding: 0; background: transparent url(../img/bg_box_header.png) 0 0 no-repeat; text-indent: -3000em; }
#content div.box div.body { position: relative; padding: 5px 5px 0; color: #333; background: #f3f3f3 none 0 bottom no-repeat; z-index: 1; }
#content div.box p.more { margin: 0; padding: 0; }
#content div.box p.more a.button { display: block; height: 29px; margin: 14px 6px 0; background: transparent none 0 0 no-repeat; text-indent: -3000em; }
/* About Us box */
#content div.about-us div.body { padding-right: 140px; background-image: url(../img/page/home/traffic_cone.jpg); }
#content div.about-us p.more { position: absolute; bottom: 0; height: 58px; }
#content div.about-us p.more a.button { width: 152px; background-image: url(../img/button_learn_more.png); }
/* Callout box */
#content div.callout .banner { background-position: 0 -120px; }
/* Featured course box */
#content div.featured-course .banner { background-position: 0 -40px; }
#content div.featured-course div.body { background-image: url(../img/page/home/safety_mask.jpg); }
#content div.featured-course h3 { padding-right: 120px; }
#content div.featured-course p { padding-right: 190px; }
#content div.featured-course p.more { position: absolute; bottom: 0; height: 58px; }
#content div.featured-course p.more a.button { width: 212px; background-image: url(../img/button_course_details.png); }
/* Upcoming courses box */
#content div.upcoming-courses .banner { background-position: 0 -80px; }
#content div.upcoming-courses div.body { padding: 0; }
#content div.upcoming-courses p.more { height: 40px; }
#content div.upcoming-courses p.more a.button { width: 212px; margin: 10px 6px 0; background-image: url(../img/button_all_courses.png); }
#content div.upcoming-courses ol { display: block; margin: 0; padding: 0; list-style: none; }
#content div.upcoming-courses li { display: block; position: relative; padding: 6px 10px 12px; background: transparent url(../img/bg_course.png) right center no-repeat; z-index: 1; }
#content div.upcoming-courses li span { display: block; color: #444; padding-bottom: 0.3em; }
#content div.upcoming-courses li span.title { font-size: 1.1em; color: #81181e; line-height: 1.1em; }
#content div.upcoming-courses li span.date,
#content div.upcoming-courses li span.venue { }
#content div.upcoming-courses li a { display: block; width: 65px; height: 25px; position: absolute; right: 8px; bottom: 0; background: transparent url(../img/button_register.jpg) 0 0; text-indent: -3000em; z-index: 2; }
#content div.upcoming-courses li a:hover { background-position: 0 -25px; }
/* Home page overloads */
#section-home div.box div.body { padding-bottom: 50px; }
#section-home div.upcoming-courses div.body { padding-bottom: 0; }
#section-home div.header div.box { padding: 6px 0; }
#section-home div.header img { margin-top: 0; }
#section-course div.description { }
#section-course p.cost { padding: 0.6em; background: #ddd; }
div.course-list .course { padding: 0.6em 0; margin: 0.6em 0; border-top: solid 1px #ccc; }
div.course-list .location { font-weight: bold; padding: 0.6em; background: #ddd; }
/* Content page overloads */
#content div.content div.box { padding: 0.6em 1em; }
#directions { width: 440px; margin: 0 auto; clear: both; }
#directions .map { width: 440px; height: 360px; }
/* Footer */
#footer { margin-top: 30px; background: transparent url(../img/bg_footer.png) 0 12px repeat-x; }
#footer .powered { color: #666; text-align: center; padding-top: 1em; }
#footer .powered a { color: #666; font-style: normal; }
#footer .powered a:hover { color: #222; }
#footer .powered a:active { text-decoration: none; }