/* 
  -----------------------------------
  PopMenu Magic Style Sheet
  by Project Seven Development
  www.projectseven.com
  Tommi Page Pack
  Horizontal 2 Column Fixed Centered
  -----------------------------------
*/

body {
	/*background-image: url(../images/tommy_pbg.gif);
	background-repeat: no-repeat;
	background-position: right bottom;*/
	color: #333333;
	margin: 5 0 0;
	padding: 0;
	background: #FBAD38 url(../images/oraangeBg.jpg);
	font: .85em "Trebuchet MS", Arial, sans-serif;
}
/*The masthead contains the Tommi logo. Width is set based on the wrapper's
total rendered width. Left and right margins are set to auto, which centers this DIV.*/
#masthead {
	width: 760px;
	margin: 0 auto;
	padding: 0;
}
/*The wrapper envelopes all page elements below the masthead.
To center the layout we set left and right margins to "auto".
To deduce the overall rendered width, left and right padding, borders,
and margin are added to the declared width of 690px. Since we have applied
70px of left padding (to make room for the "lbghz" background image),
we must add that to the declared width. The resulting rendered width is 760px.*/
#wrapper {
	margin: 0 auto;
	width: 690px;
	padding: 16px 0 0 70px;	
	background-image: url(../images/heartbg.jpg);
	background-repeat: no-repeat;
	background-position: left top;*/
}
/*	background-image: url(../images/tommy_lbghz.jpg);*/

/*The menubar DIV is the container for our menu. We set a background image and a black
border. Font-size is set to .85em, setting the menu text size. Position is set to relative
to work around bugs in IE5 Mac and Firefox Mac.*/
#menubar {
	background-image: url(../p7pm/img/tommy_hmenContainer.jpg);
	background-repeat: repeat-x;
	border: 1px solid #000000;
	background-color: #6A6A6A;
	font-size: 0.85em;
	position: relative;
	color: #CCCCCC;
}
/*This style represents a special DIV placed just inside the closing DIV tag
of menubar. This style allows the menubar background to extend to the full height
of the menu. DO NOT EDIT or remove this style or the DIV it represents in the page.*/
.clearcontent {
	clear: both;
	height: 0;
	line-height: 0;
	font-size: 1px;
}
/*The mainbox DIV is the left column that contains the page's main content.
Mainbox is floated left, adjacent to the sidebox. The sidebox is also floated
left, but since mainbox comes first in the source code, it is positioned to
the left of sidebox.*/
#mainbox {
	width: 470px;
	margin: 16px 16px 0 0;
	float: left;
	font-size: 0.85em;
}
/*Paragraphs inside mainbox and sidebox*/
#mainbox p, #sidebox p {
	margin: 6px 0 12px;
}
/*This is a class assigned to section DIVs inside the mainbox and allows each section
to have its own borders and padding, as well as a background image that sets a special "bullet" next
to each section heading. Because the "section" DIVs are nested inside mainbox, they do not affect
the layout's box model calculations.*/
.section {
	/*background-image: url(../images/tommy_secbg2.gif);*/
	background-image: url(../images/heatBg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	border-left: 1px solid #616161;
	border-right: 1px solid #616161;
	border-bottom: 1px solid #616161;
	border-top: 1px dotted #616161;
	padding: 20px 16px 0 32px;
	margin-bottom: 12px;
	line-height: 1.5em;
}
.sectionEnd {
	/*background-image: url(../images/tommy_secbg2.gif);*/
	background-image: url(../images/heatBg.gif);
	background-repeat: no-repeat;
	background-position: left top;
	border-left: 1px solid #616161;
	border-right: 1px solid #616161;
	border-bottom: 1px solid #616161;
	border-top: 1px dotted #616161;
	padding: 20px 16px 0 32px;
	/*margin-bottom: 12px;*/
	line-height: 1.5em;
}
/*Style attributes common to all level 1-4 headings*/
h1, h2, h3, h4, h5 {
	margin: 0;
	line-height: normal;
	padding: 0px;
}
/*Style attributes specific to all level 1 headings*/
h1 {
	padding: 0px;
	color: #FF6600;
	font: 1.2em "Arial Black";
}
/*Style attributes specific to all level 2 headings*/
h2 {
	font-size: 1.2em;
	color: #FF6600;
}
/*Style attributes specific to all level 3-4 headings*/
h3, h4 {
	font: .85em "Trebuchet MS", Arial, sans-serif;
}
h5 {
	font-size: 1.0em;
}
/*The sidebox DIV is the right column that contains the page's sidebar.
Sidebox is floated left, adjacent to the mainbox. The mainbox is also floated
left, but since sidebox comes after mainbox in the source code, it is positioned to
the right of mainbox.*/
#sidebox {
	width: 200px;
	margin: 16px 0 0;
	float: left;
	font-size: 0.75em;
	background: repeat-y;
}
/*-------- BOX MODEL NOTES ---------*/
/*To calculate the total layout width, we add the declared widths of
sidebox and mainbox: 180 + 494 = 674
Then we add the right margin assigned to mainbox: 674 + 16 = 690
Since wrapper has left padding of 70px, we add that to deduce the total layout width:
690 + 70 = 760 (that's why the layout-spanning masthead has a width of 760px).
*/

/*Sidesection is assigned to a DIV nested inside the sidebox DIV. By nesting this DIV,
we can add padding or borders and it will not affect the layout's box model calculations.*/
.sidesection {
	padding: 12px 8px;
	border: 1px solid #6A6A6A;
}
/*Since the footer spans the combined width of mainbox and sidebox, we set it to clear the
floats - otherwise the footer would appear under the sidebox, which immediately precedes it
in the source code. Clearing the float allows the footer to span both floated DIVs above it.*/
#footer {
	font-size: .75em;
	clear: both;
}

/*-----PAGE LINK STYLES --------*/
/*We assign specific link styles for links based upon the element that contains them.*/
a:link, {
	color: #990000;
}
a:visited,{
	color: #990000;
}
a:hover,a:active, a:focus,
{
	color: #000000;
}
.sidesection a:link, .sidesection2 a:link {
	color: #000000;
}
.sidesection a:visited, .sidesection2 a:visited {
	color: #666666;
}

.menuText a:link {
	color: #000000;
	text-decoration: none;
	font-weight: bold;
}
.menuText a:visited {
	color: #000000;
	text-decoration: none;
}
.menuText a:hover, .menuText a:active, .menuText a:focus
{
	color: #FF6600;
	text-decoration: none;
}
.menuLink a:link, .menuLink a:visited, .menuLink a:active {
	color: #FFFFFF;
	display: block;
	height: auto;
	width: 100%;
	background: #FF0000;
	font: bold 12px Geneva, Arial, Helvetica, sans-serif;
	text-align: center;
	padding-top: 2px;
	padding-bottom: 2px;
	border: 1px solid #333333;
	text-decoration: none;
}
.menuLink a:hover {
	color: #FFFFFF;
	background: #333333;
	width: 100%;
	text-decoration: none;
}



/*-----PMM MENU STYLE UPDATES for this PAGE PACK-------*/

/*We set a subtle border to the right of each top-level menu item to visually
define its box.*/
#p7PMnav a {border-right: 1px solid #777777;}

/*WORK AROUND FOR IE5 (MAC ONLY) The single backslash \ character inside this
comment causes IE5 Mac to ignore the following rule, which allows other browsers
to render top-level menu items at their natural widths.
DO NOT EDIT THIS COMMENT or the following rule. This rule should remain last in
this style sheet.*/
#p7PMnav li {
	width: auto;
}
.tableBoxBlack {
	border: 1px solid #000000;
}
.tableBoxGrey {
	border: 1px solid #CCCCCC;
}

.menuText {
	font-size: 0.85em;
	font-weight: bold;
}
.borderRightGrey {
	border-right: 1px solid #999999;
}
.quoteText {
	font-size: 0.8em;
	font-style: italic;
}
.smallerText {
	font-size: 0.9em;
}
input {
	font: .85em "Trebuchet MS", Arial, sans-serif;
	border: 1px solid #333333;
	
}
textarea {
	font: .85em "Trebuchet MS", Arial, sans-serif;
	border: 1px solid #333333;
	
}
.headerOrange {
	font-size: 1.1em;
	font-weight: bold;
	color: #FF6600;
	text-decoration: none;
}
.rrpCrossedOut {
	text-decoration: line-through;
}
.smalltext {
	font-size: 10px;
}
.salePrice {
	font-weight: bold;
	color: #FF0000;
	font-size: 18px;
}
.rrpPrice {
	font-weight: bold;
	color: #000000;
	font-size: 18px;s
}
.moneyBack {
	font: bold 15px "Arial Black", Arial, sans-serif;
}
.colouredCell {
	text-transform: uppercase;
	color: #000000;
	background: #FAB74F;
	text-align: center;
	font-size: 14px;
	border-top: 1px solid #999999;
	border-bottom: 1px solid #999999;
}
