/*graphico.co.uk*/
/*	This file must contain structural CSS only. All themed CSS should go into a theme stylesheet. */

/* The file below is read by ALL browsers
	but the hacks contained within it further target 
	IE5-6 for Windows. See file for details. */

@import "ie6win.css";
@import "ie7win.css";


/* -- Generic Initiation items not covered in "undothml.css" -- */

body
{
	text-align: left;
	font-family: Tahoma, Verdana, sans-serif;
	color: #000;
	font-size: 100%;
	border-color: #000;
}

h1, h2, h3, h4, h5, h6, p
{
	position: relative;
}

fieldset
{
	border : none;
}

legend
{
	display: none;
}

.invisible
{
	display: none;
}

.floatLeft
{
	float: left;
}

.floatRight
{
	float: right;
}

.theBreaker
{
	height: 0.005em;
	clear: both;
	overflow: hidden;
}

/*Generic Levin image replacement -  http://levin.grundeis.net/files/20030809/alternatefir.html */

.replace
{ 
	position:relative; 
	margin:0px; 
	padding:0px; 
	/* hide overflow:hidden from IE5/Mac */ 
	/* \*/ overflow: hidden; /* */ 
} 

.replace span
{
	display:block; 
	position:absolute; 
	top:0px; 
	left:0px; 
	z-index:1; /*for Opera 5 and 6*/ 
}

/*Example HTML - all elements that require replacement use the .replace class then
set the rule for the specific image and dimensions and associate with the elements ID.

<h1 id="myh1" class="replace" >Headline<span></span></h1> 

the add the CSS:
#myh1, #myh1 span
{ 
	height:100px; 
	width:300px; 
	background-image: url(head.png); 
} 
*/

.hide
{
	position: absolute;
	left: -9999px;
	top: 0;
}

.clearBoth
{
	clear: both;
}

.boldText
{
	font-weight: bold;
}

h1, h2, h3
{
	padding-left: 20px;
	border-top: 1px dotted;
	border-bottom: 1px dotted;
	background: transparent none no-repeat left top;
}

h1
{
	font-size: 1.5em;
	background-position: left 4px;
}

h2, h3
{
	padding-top: 3px;
	padding-bottom: 4px;
	background-position: left 4px;
}


/* begin normal CCS for Tier 1 browser: Firefox*/

/*	Main structure */
#outerWrap
{
	width: 760px;
	margin: auto;
	font-size: 0.71em;
}

#skipLinks
{
	background: #fff none;
	float: left;
	width: 210px;
}

#homepage #skipLinks
{
	width: 240px;
	padding-right: 10px;
	min-height: 43px;
}

#pageTop
{
	min-height: 38px;
}

#homepage #pageTop
{
	background: #fff none;
}

#pageHead
{
	clear: both;
	/*padding: 10px; RM 22/02/07 Removed padding so cross immediately follows header and header image is full width */
}

#contentWrap
{
	clear: both;
	margin: 0 10px;
}

#secondaryNav
{
	width: 180px;
	float: left;
	padding: 10px 10px 10px 0;
}

#mainContent
{
	width: 320px;
	float: left;
	padding: 10px;
}

#homepage h1#mainContent
{
	padding: 5px 0 3px 0;
	float: none;
	background: none;
	border: none;
}

.contentPage #mainContent
{
	width: 540px;
	padding-right: 0;
}

#subContent
{
	width: 200px;
	float: right;
	padding: 10px 0 10px 10px;
}

/*	Inner structure */
/*	List styling */
#breadcrumb ol, #pageFoot ol
{
	padding: 10px 0;
}

#skipLinks ol
{
	padding: 5px 0 0 10px;
}

#mainNav li, #breadcrumb li, #pageFoot li, #skipLinks li
{
	float: left;
}

#skipLinks li
{
	margin-right: 5px;
	padding-right: 5px;
	border-right: 1px solid;
	margin-top: 10px;
}

#mainNav ol
{
	padding: 10px 0 0 20px;
}

#mainNav li
{
	margin-right: 25px;
	white-space: nowrap;
	font-weight: bold;
	font-size: 115%;
}

#breadcrumb
{
	clear: both;
}

#breadcrumb li /*	Background is not editable */
{
	background: transparent url(../images/generic/bgNext.gif) no-repeat right 5px;
	padding: 0 7px 0 5px;
}

#breadcrumb li.firstItem
{
	padding-left: 0;
}

#secondaryNav ol
{
	margin-top: 5px;
}

#secondaryNav li
{
	margin: 0 0 3px 20px;
}

.selectedItem
{
	font-weight: bold;
}

/*	OVERRIDE - must appear AFTER the list styling above */
#outerWrap li.lastItem, #outerWrap li.lastItem a
{
	border-right: none;
	background: transparent none;
}

#mainNav /*	Background not editable */
{
	padding-bottom: 10px;
	background: transparent url(../images/generic/bgMainNav.gif) no-repeat left top;
}

/*	Homepage styling */
.column1 p, .column2 p, .column3 p
{
	margin: 5px 0;
}

.productList
{
	border-bottom: 1px dotted;
	padding-bottom: 5px;
}

.productList, .productList ol
{
	margin-top: 5px;
}

.productList li
{
	clear: both;
	margin-bottom: 5px;
	border-bottom: 1px dotted;
	padding-bottom: 6px;
}

.productList img
{
	float: left;
	margin: 0 5px 5px 0;
}

.productList h3
{
	margin: 0;
	padding: 0;
	border: none;
	background: none;
}

.briefContentList
{
	margin: 10px 0 5px 0;
}

.briefContentList ol
{
	list-style: decimal inside;
	margin: 5px 0;
}

.briefContentList li
{
	margin: 4px 0;
}

.prayerLink
{
	display: block;
	margin: 5px 0;
	font-weight: bold;
}

.firstHeading
{
	margin-top: 30px;
}

/*	Product Listings */
h2.currentPage
{
	float: left;
	font-weight: bold;
	background: transparent none;
	padding: 0;
	border: 0;
	margin: 10px 0;
}

.productListNav
{
	float: right;
	font-weight: bold;
	margin: 10px 0;
}

.productListNav li
{
	float: left;
}

.productListNav .prevLink
{
	background: transparent url(../images/generic/bgPrevious.gif) no-repeat left 5px;
	padding: 0 5px 0 10px;
}

.productListNav .nextLink
{
	background: transparent url(../images/generic/bgNext.gif) no-repeat right 5px;
	padding: 0 7px 0 5px;
}

#products li
{
	border-bottom: 1px dotted;
	margin: 5px 0;
	padding: 5px 0;
}

#products img
{
	float: left;
	margin: 0 5px 5px 0;
}

#products .productText
{
	float: left;
	width: 190px;
}

#products .productText h3
{
	background: transparent none;
	padding: 0;
	margin: 0;
	border: 0;
}

#products .productPurchase
{
	float: left;
	width: 75px;
	font-weight: bold;
	text-align: center;
}


/*	END product listings */

/*	The main page for the products */
#productFullDetails
{
	width: 320px;
}

#productFullDetails .mainImage, #productFullDetails .productCreator
{
	margin: 5px 5px 5px 0;
}

#productFullDetails .productCreator
{
	float: left;
}

#productFullDetails .productPrice
{
	margin: 5px 0;
	font-weight: bold;
	float: right;
}

#productFullDetails form
{
	float: right;
	width: 171px;
	margin-top: 30px;
}

#productFullDetails form #mobileNo
{
	width: 165px;
}

#productFullDetails form #buySubmit
{
	margin-top: 3px;
	float: right;
}

#productFullDetails .productDescription
{
	clear: both;
	margin-top: 10px;
}

/*	END main page for the products */

/*	Mobile compatibility panel	*/
#mobileCompatible
{
	margin-top: 10px;
}

#mobileCompatible h2
{
	margin-bottom: 5px;
}

#mobileCompatible #mobileCheckList
{
	width: 239px;
}

#mobileCompatible #mobileCheckList optgroup
{
	font-style: normal;
	background: #ddd none;
}

#mobileCompatible #mobileCheckList option
{
	background: #fff none;
}

#mobileCompatible input
{
	margin-top: 5px;
}

/*	END mobile compatibility panel*/

/*	Secondary content */
#subContentListPanel ol
{
	/*list-style: decimal;*/
	list-style-position: inside;
	margin: 5px 0 0px 2px;
}

#subContentListPanel li
{
	border-bottom: 1px dotted;
	padding-bottom: 5px;
	padding-top: 2px;
}

#subContentListPanel img
{
	float: left;
	margin: 0 5px 5px 0;
}
/*	Search panel */
#searchPanel
{
	float: right;
	padding: 10px 10px 0 0;
	width: 220px;
	min-height: 33px;
	background: #fff none;
}

#homepage #searchPanel
{
	width: 240px;
}

#searchForm .textInput
{
	float: left;
	width: 142px;
	margin-top: 1px;
	margin-left: 20px;
}

#homepage #searchForm .textInput
{
	width: 162px;
}

#searchForm #searchSubmit
{
	float: right;
}

/*	END search panel */

/*	Send to a friend panel */
#friendPanel
{
	padding: 10px 0;
}

#homepage #friendPanel
{
	margin-top: 94px;
}

#friendForm
{
	margin-top: 10px;
}
#friendForm label
{
	position: relative;
}

#friendForm #friendEmail
{
	width: 194px;
	padding-left: 1px;
}

#friendForm #friendSubmit
{
	margin-top: 3px;
	float: right;
}

#homepage #friendEmail
{
	margin-top: 4px;
	float: left;
}

/*	END send to a friend panel */

/*	Generic content pages */
.contentPage #mainContent h2
{
	font-size: 1.3em;
}

.contentPage #mainContent p
{
	margin: 10px 0;
}

.contentPage #mainContent ol
{
	list-style: decimal inside;
	margin: 3px 0;
}

.contentPage #mainContent ul
{
	list-style: disc inside;
	margin: 10px 10px 10px 10px;
}

.contentPage #mainContent img
{
	float: left;
	margin: 3px 5px 5px 0;
}

.contentPage #mainContent a
{
	text-decoration: underline;
}

/*	END Generic content pages */

/*	END secondary content */

/*	Footer	*/
#pageFoot
{
	clear: both;
	border-top: 1px dotted;
	margin: 10px;
	width: 740px;
	padding-bottom: 10px;
}

#homepage #pageFoot
{
	border: none;
}

#pageFoot li
{
	display: inline;
	margin-right: 6px;
	padding-right: 6px;
	border-right: 1px solid;
	font-weight: bold;
	font-size: 100%;
}

#pageFoot p.copyright
{
	clear: both;
	text-align: right;
	padding-top: 5px;
	font-size: 0.8em;
}

#pageFoot ol
{
	clear: both;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 15px;
}

#footerBase
{
	background: transparent url(../images/generic/bgMainNav.gif) no-repeat left top; /*	Background not editable */
	height: 10px;
	margin-top: 5px;
}

/*	END footer */

/*	Generic form styling	*/
input, select, textarea
{
	font-family: arial,helvetica,sans-serif;
	font-size: 100%;
	color: #000;
}

.rightInput {
	display: block;
	float: left;
	margin-bottom: 10px;
}

.leftLabel {
	display: block;
	float: left;
	clear: left;
	width: 240px;
	text-align: left;
	margin-right: 5px;
	font-weight: bold;
}

.cbxLabel
{
	width: 350px;
	clear: none;
	text-align: left;
}

.cbxField
{
	float: left;
	margin-right: 5px;
	margin-bottom: 10px;
}

.textInput
{
	border: 1px solid #7F9DB9;
	padding-left: 1px;
	height: 1.5em;
}

#flashcontent
{
        width: 140px;
        float: left;
} 

#productDetailContainer
{
 float: left;
 width: 171px;
}


#breadcrumb ol
{
    margin-left: 10px;
    font-weight: bold;
}

.error {
	color: #ff0000;	
}

#mainContent ul li
{
    list-style-position: outside;
    margin-left: 10px;
}