/**** ************************************************************** ****/
/**** TO LEARN MORE ABOUT CSS PLEASE VISIT http://www.w3schools.com/css/ ****/
/**** ************************************************************** ****/

/**** **************** ****/
/**** GLOBAL ELEMENTS ****/
/**** **************** ****/

* {margin: 0; padding: 0}
body {background: url("images/page_bg.gif") repeat-x top left #608c5b; text-align: center; font-family: arial, sans-serif; font-size: 12px; color: #000}

#container {width: 900px; text-align: left; background: url("images/container_bg.gif") repeat-y top left; background-position: 298px 0; margin: auto}


img.floatRight {float: right; margin: 10px 10px 0 0}
div.clear {clear: both}

a {color: #4192b8; text-decoration: none; font-weight: normal}
a:hover {text-decoration: underline}

/**** **************** ****/
/**** HEADER ELEMENTS ****/
/**** **************** ****/

#header {width: 900px; height: 305px; background: url("images/header.jpg"); clear: both}

#header #menu ul {list-style-type: none; padding: 64px 10px 0 0; float: right}
#header #menu ul li {list-style-type: none; display: inline; padding: 0 6px 0 6px; border-right: 1px solid #e6e6e6}
#header #menu ul li.noBorder {border-right: 0px solid #e6e6e6}
#header #menu ul li a:hover {text-decoration: none; color: #9e9e9e}

#header #phone {height: 40px; width: 200px; padding: 240px 0 0 105px; float: left}
#header #phone h2 {color: #f99b00; font-size: 18px}
#header #phone p {color: #2f2c3b; font-size: 16px; padding: 1px 0 0 0}

/**** **************** ****/
/**** SIDEBAR ELEMENTS ****/
/**** **************** ****/

#sidebarWrapperTileBg {width: 288px; background: url("images/sidebar_bg2.gif") repeat-y top left; float: left; border: 0px solid green}
#sidebarWrapperTopBg {width: 288px; background: url("images/sidebar_bg.jpg") no-repeat top left; border: 0px solid red; float: left}
#sidebarWrapperBottomBg {width: 288px; background: url("images/sidebar_bottom_cap.gif") no-repeat bottom left; border: 0px solid blue; float: left}

#sidebarWrapperBottomBg #promoCode {width: 175px; padding: 0px 0 12px 105px; }
#sidebarWrapperBottomBg #promoCode h2 {color: #f99b00; font-size: 18px}
#sidebarWrapperBottomBg #promoCode p {color: #2f2c3b; font-size: 16px; padding: 1px 0 0 0}

#sidebarWrapperBottomBg #menu {margin-top: 9px; }
#sidebarWrapperBottomBg #menu ul {list-style-type: none; margin: 15px 5px 0 105px; padding: 0 0px}
#sidebarWrapperBottomBg #menu ul li {list-style-type: none; padding: 4px 0}
#sidebarWrapperBottomBg #menu ul li a {color: #4192b8; font-size: 13px; font-weight: bold; text-decoration: none}
#sidebarWrapperBottomBg #menu ul li a:hover {text-decoration: underline}

#sidebarWrapperBottomBg #order {padding-right: 30px;}

/**** **************** *****/
/**** CONTENT ELEMENTS ****/
/**** **************** *****/

#contentTopBg {width: 900px; background: url("images/content_bg.gif") repeat-x top left;}
#content {width: 612px; float: right}

#content h1 {margin: 20px 50px 10px 50px; color: #2f2c3b; font-size: 26px; text-transform: uppercase}
#content h2 {margin: 20px 50px 10px 50px; color: #f99b00}
#content p {margin: 10px 65px 10px 50px}
#content table {margin-left: 50px; font-size: 15px;}
#content img {padding-right: 20px;}

#content ul {list-style-type: none; margin: 30px 60px}
#content ul li {list-style-type: none; background: url("images/bullet.gif") top left no-repeat; padding: 0px 0 15px 25px}

/**** **************** ****/
/**** FOOTER ELEMENTS ****/
/**** **************** ****/

#footer {width: 900px; height: 260px; background: url("images/footer_bg.gif") no-repeat top center; color: #ccc; margin: auto; margin-bottom: 21px; clear: both; text-align: right}
#footer p {padding: 180px 70px 20px 0}
#footer p a {font-weight: normal}
#footer small {display: block; margin: 0; font-size: 11px}
#footer a:hover {text-decoration: underline}