/*

	RALPH R. SMITH & SON -
	VERSION 1.0
	
	-----------------------------------------
	
	author: Michel Joanisse
	email: michel.joanisse@mountainmamma.com
	website: http://www.mountainmamma.com
	last updated: February 13th, 2009
	
	-----------------------------------------
	
	CONTENTS ----------
	
	   1.BODY
	   2.DEFAULT STYLING
	   3.BRANDING/MASTHEAD
	   4.PRIMARY NAVIGATION
	   5.SIDEBAR
	   6.LAYOUT
	   7.SITEINFO/FOOTER
	   8.PAGE SPECIFICS
	   9.FORMS
	   
    -------------------
	Developer NOTES -
	-------------------
	
	PROBLEM: *In modern browsers, the 2ndtier layout shifts to the right by a few pixels, 
	FIX:
	
	PROBLEM: *In IE6-7 Bottom bg image shifted 1px to the right..
	FIX:
	
	PROBLEM: *In Modern browsers, when text-increases on 2ndtier pages by 5-6 sizes, 
	page once again, slightly shifts by 1pixel to the left/right.
	FIX:
	
*/


/* 1.BODY
---------------------------------------------------------------------- */


/* 2.DEFAULT STYLING
---------------------------------------------------------------------- */
* {
	margin:0;padding:0;
	font-family:Arial, Tahoma, Verdana, Helvetica, sans-serif;
	font-size:12px;
	color:#506977;
	line-height:14px;
}

html {background:#cfdce4/*<--LIGHT BLUE*/}

body {padding-top:15px;background:#fff;}
.clear {clear:both;}
a img {border:0;}

#topelements {width:100%;background:#cfdce4;padding-top:15px;float:left;}
#topelements div.container {margin:0 auto;width:800px;}

#topelements h1#branding a {
	display:block;float:left;
	text-decoration:none;
	outline:none;border:0;
	text-indent:-1000em;
	width:391px;height:23px;margin-top:17px;
	background:url(../images/logo.gif) top left no-repeat;
}/*h1 specific-->*/#topelements h1#branding {margin:0;padding:0;}

#topelements #primarynav {
	background:#fff url(../images/primarynav.gif) top left no-repeat;
	min-height:47px;float:right;width:395px;
	_height:47px;
}

#primarynav ul {margin:10px 10px 0 12px;}
#primarynav ul li {display:inline;}
#primarynav ul li a span {padding-top:12px;display:block;color:#fff;}
#primarynav ul li a.active span {color:#5d80c0;}

#primarynav ul li a {
	float:left;
	display:block;
	color:#fff;	
	margin-right:1px;
	text-align:center;
	text-decoration:none;
	height:36px;width:92px;
	background:#cf6a99 url(../images/tabs.gif) top left no-repeat;
}

#primarynav ul li a:hover {text-decoration:underline;background-position:top right;_background-position:top left;}
#primarynav ul li a.active {background-image:url(../images/tabs-active.gif);color:#5d80c0;}
#primarynav ul li a.active:hover {text-decoration:none;cursor:default;_cursor:0;}

.wrapper {
	width:100%;float:left;
	background:#cfdce4/*<--LIGHT BLUE*/ url(../images/bg-tile.gif) top left;
}

.frame {
	background:#fff;
	width:800px;
	margin:0 auto;
}

.containment {float:left;background:#fff;width:780px;margin:0 auto;padding:10px;padding-bottom:0;}


/*BANNER ELEMENT PROPERTIES*/
div.banner {
	background-color:transparent;
	background-repeat:no-repeat;
	background-position:top left;
	width:780px;height:148px;
	position:relative;
}

div.banner .boxes.box2 {
	background:0;
	border:0;
	padding:0;
	float:right;
	width:210px;
	margin-top:40px;
	position:absolute;
	right:0;
	z-index:1;
}

div.banner .boxes.box2 ul {background:0;padding:0;text-align:left;}

/*Index/Home Page*/
body#home div.banner {height:208px;background-image:url(../images/banner-50years.jpg);}

body#home .banner p {
	position:absolute;
	top:25px;right:27px;
	width:240px;
	line-height:18px;
	color:#506977;
}

body#home .banner p span {font-size:10px;color:#506977;}
/*Header/Banner specifics*/
div.banner.alt01 {background-image:url(../images/banner-alt01.jpg);}
/*END*/

/* 1.MIDDLE CONTENT
---------------------------------------------------------------------- */
.wrapper#middlecontent {
	padding:10px 0;
	background:#fff;
}

.wrapper#middlecontent .frame {
	background:#cf6a99;
	width:100%;
	margin:0;
	float:left;
	padding:10px 0;
}

.wrapper#middlecontent .containment {
	background:#f6e5ec url(../images/promo-top.gif) top left no-repeat;width:989px;
	float:none;padding:0;padding-top:10px;
}

.wrapper#middlecontent #promo {
	float:left;padding:10px;padding-bottom:20px;
	width:969px;
	background:#f6e4ec url(../images/promo-btm.gif) bottom center no-repeat;
	
}

#promo img {float:left;margin-right:10px;border:0;outline:0;}

#promo h2 {
	font:18px Tahoma, Arial, Verdana, Helvetica, sans-serif;
	color:#cf6a99;/*<--DARK PINK*/
	margin-bottom:5px;
}

#promo p {margin-left:268px;}

#promo p,
#promo p strong,
#promo p em {
	color:#cf6a99;/*<--DARK PINK*/
	line-height:18px;
	font-size:12px;
}



/*-----
BUTTONS
------*/
a.btns {
	position:static;
	float:right;
	color:#fff;
	width:79px;
	padding-top:3px;
	text-align:center;
	background:transparent url(../images/btn-order_top.gif) top left no-repeat;
	font-family:Arial, Tahoma, Verdana, Helvetica, sans-serif;
	font-size:11px;cursor:pointer;
	text-decoration:none;
	margin-top:10px;
}

a.btns span {
	width:79px;
	float:left;
	color:#fff;
	display:block;
	padding-bottom:3px;
	font-size:11px;cursor:pointer;
	font-family:Arial, Tahoma, Verdana, Helvetica, sans-serif;
	background:transparent url(../images/btn-order_bottom.gif) bottom left no-repeat;
}

div.products a.btns {
	background-image:url(../images/btn-order_top-alt.gif);
	width:71px;position:absolute;
	top:70px;right:8px;
}

/*Page Specifics*/
div.products a.btns span {background-image:url(../images/btn-order_bottom-alt.gif);width:71px;}
div.products a.btns#unique {top:22px;}
div.banner a#order {position:absolute;left:140px;top:115px;margin-top:0;z-index:2;}

/*Hover State(s)-->*/div.products a.btns:hover {background-position:top right;}
/*Hover State(s)-->*/div.products a.btns span:hover {background-position:bottom right;}
/*End*/



/*Second Column*/
.doublecolumn#secondcol {
	float:right;
	width:332px;
	padding:20px 20px 0 0;
}

.boxes {
	background:#efefef;
	width:270px;
	float:left;clear:left;
	margin-bottom:10px;
	padding:15px;
}

body#sidebarfloat .boxes {padding-bottom:0;}
body#sidebarfloat .boxes p {line-height:12px;}
body#home .boxes {width:260px;}

.content .boxes p,
.content .boxes a,
.content .boxes li,
.content .boxes strong,
.content .boxes span {
	color:#777;
	font-size:12px;
}

/*Box3*/
.boxes.box3 {
	float:none;
	position:absolute;
	background:0;
	width:195px;
	margin-left:8px;
	margin-top:0;
}/*Order Page Specific-->*/.boxes.box3.orderpg {margin-top:15px;}

.boxes.box3 h2 {
	color:#cf6a99;
	font-size:16px;
	line-height:18px;
	font-family: Georgia, "sans-serif", Tahoma, Arial;
	font-weight:normal;
	margin-bottom:10px;
}

.boxes.box3 p {line-height:14px;}

.boxes.box3 p,
.boxes.box3 em,
.boxes.box3 strong {color:#cf6a99;}


/*Box2*/
.boxes.box2 {background:#bdd3fb;}
.boxes.box2 * {color:#5d7989;}
.boxes.box2 ul {
	text-align:center;
	list-style:none;
}

.boxes a:hover {color:#cf6a99;background:#f6e5ec;}
.boxes.box2 ul li.unique {font-family:Georgia, "Times New Roman", Times, serif;font-size:16px;font-style:italic;padding-bottom:10px;}
.boxes.box2 ul li.alt {padding-bottom:10px;}
.boxes.box2 strong {font-size:16px;}

/*Box1*/
.boxes.box1 * {color:#777;}
.boxes.box1.btm {width:710px;padding-bottom:0;}
.content .boxes.box1.btm p {_line-height:14px;}
.boxes.box1 p {
	padding-left:62px;line-height:16px;
	background:url(../images/icon-usaflag.jpg) top left no-repeat;
}

.boxes.box1 p span {display:block;margin-top:10px;line-height:18px;}

/* 2.LOWER CONTENT
---------------------------------------------------------------------- */
body#home .wrapper#lowercontent .containment {padding-top:0;}
.wrapper#lowercontent .containment {padding-top:10px;position:relative;z-index:4;}
.wrapper#lowercontent {position:relative;z-index:3;}

.content p,
.content strong,
.content span,
.content li,
.content li a,
.content h2,
.content h1 {color:#68889a;}

h1 {font-size:24px;font-family:Georgia, Verdana, "Times New Roman", Times, serif;margin-bottom:20px;padding-top:20px;}
.content h3 {color:#cf6a99;}
.content p em {color:#7489a3;}
.content p a {color:#cf6a99;}
.content p a:hover {color:#cf6a99;background:#f6e5ec;}
.content p em.alt {font-style:normal;font-family:Georgia, "Times New Roman", Times, serif;color:#7489a3;}
.content ul {margin-left:15px;margin:10px 0 15px 15px;}
.content img {margin:10px 0;}
.content li a:hover {color:#cf6a99;background:#f6e5ec;}

.content h2,
.content h2 a {font-size:16px;margin:10px 0;font-weight:normal;font-style:italic;color:#cf6a99;}

.content p.attention {
	background:#FFFFCC;
	clear:left;width:700px;margin-top:20px;
	padding:30px 20px;line-height:18px;
	font-size:14px;
}

.content p.attention em {
	font-size:16px;
	line-height:18px;
	font-style:italic;
}

body#home .content {background:#f0f0f0;}

.content {
	width:440px;float:left;
	padding:20px;
	padding-top:0;
}

body .content#singlecol {width:740px;}
body#sidebarfloat .content {width:auto;padding-right:0;}

.content p {
	line-height:22px;
	margin-bottom:20px;
}

/*Our Spoons - Products container----*/

.content ul.orderinfo * {font-size:12px;}
.content ul.orderinfo li.alt {background:#eeffc5;}
.content ul.orderinfo li strong {font-style:normal;letter-spacing:normal;}
.content ul.orderinfo li {
	font-style:italic;
	letter-spacing:1px;
	padding:6px 0;
}

.content div.products {
	position:relative;
	float:left;
	margin:10px 0;
	width:740px;
	padding:15px 0;
}

.content div.products h2,
.content div.products h2 a {line-height:20px;}

.content div.products img {
	float:right;border:1px dotted #aaa;_border:1px solid #aaa;
	width:430px;height:80px;margin-left:10px;
}

.content div.products ol {
	background:#f6e5ec;
	margin-left:0;
	padding:15px 0;
}

.content div.products ol li {
	margin-left:40px;
	line-height:32px;
}

.content div.products ol li a {
	color:#cf6a99;
	background:#fff;
	padding:3px;
}

/*Suggested Engravings---*/
#suggestedengravings {clear:left;float:left;width:760px;}

#suggestedengravings h4 {
	font-size:16px;
	font-weight:normal;
	font-family:Georgia, "Times New Roman", Times, serif;
}

#suggestedengravings .suggestion ul li {font-size:12px;}
.content #suggestedengravings p {padding:0;text-align:right;line-height:14px;}
.content #suggestedengravings p em {font-size:11px;}
#suggestedengravings .suggestion {
	width:190px;min-height:160px;_height:160px;
	background:#efefef;
	padding:12px 25px;
	margin:10px 10px 10px 0;
	float:left;
}

/*Gift Box Preview---*/
.content p#tagline {
	font-weight:bold;
	line-height:14px;
	list-style:none;
	text-align:center;
	padding-right:15px;
}

.content div#giftbox {float:right;margin-left:15px;}
.content div#giftbox img {margin:0;}
.content div#giftbox p {padding:3px 0;line-height:12px;}
.content div#giftbox p,
.content div#giftbox em {
	color:#cf6a99;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
}

/*----------------------
RALPH R. SMITH SIGNATURE
-----------------------*/

.content dl.signature * {font-weight:bold;}
.content dl.signature span,
.content span.signature {
	display:block;
	width:101px;height:43px;
	margin:5px 0;
	text-indent:-1000em;
	background:url(../images/signature-ralph.gif) top left no-repeat;
}

/* SIDEBAR
---------------------------------------------------------------------- */

div#highlights {
	background:url(../images/featureboxes-bg.gif) top left repeat-y;
	float:left;
}

a.featureboxes {
	display:block;
	float:left;
	clear:left;
	width:270px;
	padding:15px;
	text-decoration:none;
	margin-bottom:10px;
	outline:none;
}

.content a.featureboxes img,
a.featureboxes img {float:left;margin:0;margin-right:10px;border:1px solid #959494;}

.content a.featureboxes em,
a.featureboxes em {
	margin:0;padding:0;
	margin-top:0;*margin-top:5px;
	float:left;width:240px;
	font-size:12px;color:#7d7d7d;
	line-height:14px;
	font-style:normal;
	display:block;
}

.content a.featureboxes span.title,
a.featureboxes span.title {
	float:left;
	font-family:Georgia, Arial, Tahoma, "Times New Roman", Times, serif;
	font-size:18px;
	width:95px;
	margin:0;
	padding-bottom:8px;_padding-bottom:0;
	line-height:20px;
	font-style:italic;
	font-weight:normal;
	display:block;
}

a.featureboxes#samples {background-color:#f6e4ec;/*<--LIGHT PINK*/}
a.featureboxes#samples span.title {color:#ee3b8e;}

a.featureboxes#engravings {background:#dee6eb/*<--MEDIUM BLUE*/}
a.featureboxes#engravings span.title {color:#63956e;}/*<--DARK BLUE*/

a.featureboxes#giftbox span.title {color:#7195a9;width:150px;padding-bottom:0;cursor:pointer;}

/*Home Page Specifics*/
body#home a.featureboxes {width:206px;clear:none;margin-bottom:0;}
body#home a.featureboxes em {margin-top:50px;_margin-top:0;float:none;width:auto;}
body#home a.featureboxes#giftbox em {_clear:both;_margin-top:-2px;}
body#home a.featureboxes span.title {float:right;}
/*body#home a.featureboxes#giftbox p {margin-top:65px;}*//*USE THIS IF TITLE EXTENDS TO 3 LINES*/
body#home a.featureboxes#giftbox {width:268px;_width:265px;background:#f0f0f0;}
body#home a.featureboxes#samples {margin-right:10px;}
body#home a.featureboxes#engravings {background:#dee6eb url(../images/featureboxes-engravingscorner.gif) top right no-repeat;}
/*end*/

#sidebar {float:right;}


/* FOOTER
---------------------------------------------------------------------- */
#footer p,
#footer ul li,
#footer a,
#footer strong,
#footer span,
#footer em {font-family:Tahoma, Arial, Verdana, Helvetica, sans-serif;font-size:11px;color:#54707f;}
body#home #footer {background:#cfdce4 url(../images/footer-bg.gif) top center no-repeat;}

#footer {
	margin-top:0;
	clear:both;
	float:left;
	padding-top:40px;padding-bottom:30px;
	width:100%;
	background:#cfdce4 url(../images/footer-bg-alt.gif) top center no-repeat;
}

#footer #wrapper {
	margin-top:0;
	margin-left:auto;
	margin-right:auto;
	width:800px;
}

#footer #wrapper ul li a {
	display:block;
	_display:inline;
	float:left;
	margin:0 5px;
	padding-bottom:3px;
}


#footer #wrapper a#mmlogo {
	float:left;
	color:#aab6bd;
	font-size:10px;
	font-family:Arial;
	min-height:35px;
	margin-left:5px;
	padding-right:45px;
	padding-top:7px;
	_height:35px;
	text-decoration:none;
	background:url(../images/mmlogo.gif) top right no-repeat;
}/*Hover State-->*/#footer #wrapper a#mmlogo:hover {text-decoration:underline;}


#footer #wrapper a#mmlogo span {display:block;text-indent:-1000em;height:0;_display:none;}
#footer #wrapper div {width:460px;float:right;}
#footer #wrapper div p {float:none;width:auto;text-align:right;margin-bottom:5px;margin-top:5px;}
#footer #wrapper div p span {font-family:Georgia, "Times New Roman", Times, serif;font-size:12px;}
#footer #wrapper ul li a:hover {color:#cf6a99;background:#f6e5ec;}
#footer #wrapper ul {float:right;}
#footer #wrapper ul li {display:inline;}
 

/* 9.FORMS
--------------------------------------------------------*/

form#order {
	padding-top:0;
	margin-right:20px;
	_margin-right:16px;
}

form#order * {font-size:12px;color:#68889a;}
form#order fieldset {outline:0;border:0;}
form#order div {margin:5px 0;padding:1px;width:350px;clear:both;}
form#order div.right {width:auto;float:right;_display:inline;}
form#order div p {line-height:normal;}
form#order select > option.italic {font-style:italic;}
form#order label.required {color:#cf6a99;background:#f6e5ec;}
/*form#order h2 {font-weight:bold;font-style:normal;text-align:left;color:#cf6a99;}*/
form#order h1 {font-size:24px;margin-bottom:15px;}

form#order h5#shipping {
	width:330px;
	float:none;
	margin:0;
	margin-top:5px;
	margin-bottom:38px;
	_margin-bottom:59px;
}


form#order input.checkbox {
	float:left;
	width:auto;
	margin-top:1px;
	*margin-top:-2px;
	margin-right:5px;
	padding:0;
	border:0;
	background:transparent;
	outline:0;
}

html body .content form#order  div.confirm {
	border: 1px solid #FEF2BE;
	padding: 0px 0px 10px 0px;
	
}

html body .content form#order div.confirm h5 {
	margin-top: 0px;
} 

html body .content form#order div.confirm p {
	font-size: 12px;
	font-family: Courier, "Courier New", monospace;
	padding: 5px;
}

form#order h5, form#order #sameaddress {
	padding:10px;
	letter-spacing:1px;
	width:330px;
	background:#fef2be;
	float:left;
	line-height:14px;
	font-size:14px;
	text-transform:uppercase;
	font-weight:normal;
	margin:10px 0;
}

html body form#order #sameaddress {
	margin-top: 10px;
}

form#order #sameaddress strong  {
	float: left;
	width: 100px;
}
form#order #sameaddress span {
	float: left;
	text-align: right;
	width: 200px;
	margin-top: -3px;
}


form#order input#shipping_same_as_billing {
	display: inline;
	float: none;
}

form#order label {
	float:left;
	font-size:12px;
	width:140px;
	font-family:Arial, "Trebuchet MS", Arial;
	margin-right:15px;padding:5px;
}

form#order input.products {width:250px;margin-left:10px;font-size:14px;background:#fff;}
form#order input.products.sml {width:150px;font-style:italic;}


form#order select.products:active,
form#order select.products:focus {background:#dee6eb;}

form#order input.products:active,
form#order input.products:focus {background:#FFFFCC;color:#7195a9;}

form#order input,
form#order select {
	border:1px solid #dee6eb;
	outline:0;
	width:176px;_width:174px;
	background:#f1f1f1;
	padding:3px;
}

form#order select {width:184px;_width:182px;}
form#order button {float:right;margin-top:10px;}

/*-----
BILLING
------*/
form#order div#billing {
	margin:0;
	float:left;
}

/*------
SHIPPING
-------*/
form#order div#shipping {
	margin:0;clear:none;
	float:right;
}

/*-----
BUTTONS
------*/

form#order div.buttons {
	float:left;*float:none;
	width:741px;margin-bottom:20px;
}

form#order button {
	cursor:pointer;
	overflow:visible;
	padding:3px 7px;
}


/* 10.TABLES
--------------------------------------------------------*/

/*------------
ORDER PRODUCTS
-------------*/
table.products * {font-size:12px;color:#68889a;}
table.products {
	float:left;margin:0;margin-top:20px;
	border-collapse:collapse;
	clear:left;*clear:none;
	background:#fff;
	_float:none;
	width:741px;
}

table.products tr.colheaders th span {
	display:block;
	padding:15px 10px;
	background-color:#dee6eb;
	background-repeat:no-repeat;
	background-image:url(../images/productstable_header.gif);
}

table.products tr.colheaders th#left {background:#dee6eb url(../images/productstable_header.gif) top left no-repeat;padding-left:0;}
table.products tr.colheaders th#left span {background-position:bottom left;}
table.products tr.colheaders th#right {background:#dee6eb url(../images/productstable_header.gif) top right no-repeat;}
table.products tr.colheaders th#right span {background-position:bottom right;padding-left:0;}

table.products tr.colheaders th {
	text-align:left;
	background-color:#dee6eb;
	padding-top:5px;
	padding-left:5px;
	font-size:12px;
	font-weight:normal;
	text-transform:uppercase;
}

form#order table.products tr th.rowheaders {
	text-align:left;padding-left:10px;font-size:14px;font-weight:normal;
	width:390px;font-family:Georgia, "Times New Roman", Times, serif;
}

table.products tr th.rowheaders em {font-weight:normal;}
table.products caption {display:none;}
table.products tr.alt {background:#f1f1f1;}
table.products tr.alt3 {background:#dee6eb;}
table.products tr.promo {background:#EEFFC5;}
form#order table.products tr.promo td.savings {color:#4CC03B;padding:20px 5px;}
table.products tr td {padding:10px 5px;}
table.products tr td span {letter-spacing:8px;margin-left:8px;}

table.products tr td.value {
	text-align:right;
	font-weight:bold;
}

table.products td.qnty {border-left:0;width:120px;}
form#order table.products td.qnty em {font-size:10px;}

form#order table.products td.savings {
	text-decoration:underline;
	font-style:italic;
	color:#f9703a;
}

form#order table.products td.savings span {
	display:block;text-indent:-1000em;
}


/*-----------
ORDER SUMMARY
------------*/
form#order div.summary * {margin:0;padding:0;color:#7195a9;}
form#order div.summary {
	/*border-bottom:1px dotted #abadb3;*/
	padding-bottom:10px;
	padding-top:5px;
	margin-top:10px;
	float:left;
	clear:both;
	width:740px;
}

form#order div.summary textarea {
	float:left;
	min-height:75px;
	_height:65px;
	width:390px;
	padding:3px;
	background:#f1f1f1;
	border:1px solid #abadb3;
}

form#order div.summary div {
	width:340px;
	clear:none;
	float:right;
}

form#order div.summary label {
	text-align:right;
	clear:both;
	font-style:italic;
	float:right;
	width:120px;
}

form#order div.summary input,
form#order div.summary input:focus,
form#order div.summary input:active {
	border:1px solid #abadb3;
	font-size:12px;
	padding:3px;
	width:116px;
	clear:both;
	margin:4px 0;
	text-align:right;
	float:right;
}

form#order div.summary input:focus,
form#order div.summary input:active,
form#order div.summary textarea:focus,
form#order div.summary textarea:active {background:#fff;}

form#order div.summary select {
	border:1px solid #abadb3;
	margin-bottom:10px;
	width:330px;
	padding:3px;
	float:right;
}

form#order div.summary div.suggestions {
	clear:both;
	margin-top:5px;
	float:left;
	width:398px;
}

form#order div.suggestions label {width:auto;text-align:left;}
form#order div.summary select option.alt {background:#fff;}
form#order div#sameaddress {margin-top:20px;}
form#order div.pars {margin:10px auto;}

form#order div.pars p,
form#order div.pars em {font-size:14px;}