﻿/* ========== Overall page layout ========== */

body 
{
	background-color: rgb(242, 242, 242); 
	color: rgb(0,0,100);
}

div.wrapper 
{
	margin-left: auto;
	margin-right: auto;
	width: 900px;	
}

div.content 
{
	background-color: White;
	min-height: 420px;
	_height:420px; 
}

div.main
{
	width: 900px;	
	background-color: White;
	padding-bottom:20px;
	display: table;
}

/* ========== ???????? ========== */

/* Do not use in this form on this site as it changes the default layout of the DL element, and this will cause
 html loaded from the database to render incorrectly.

use dl.inline or something */

/* dl { margin: 0px; padding-left: 15px; padding: 0px; display: block; width: 470px; }
dl dt { margin: 0px; margin-top: 5px; width: 170px; float: left; display: inline; clear: left; font-weight: bold; color: rgb(74, 138, 11);}
dl dd { margin: 0px; margin-top: 5px; width: 300px; float: left; display: inline; } */

/* ========== Control containers and validation ========== */

div.page-messages 
{
	background-color:#DDFFDD;
	border:solid 3px green;
	padding:15px;
}

div.validation-errors {
	background-color: #FFDDDD;
	border:solid 3px red;
	padding:15px;
}

div.control-container 
{
	clear:left;
	padding-bottom:2px;
}

div.control-container label
{
	display:block;
	float:left;
	width:170px;
}

.textbox-narrow
{
	width:50px;
}

.textbox
{
	width:131px;
}

.textbox-wide
{
	width:210px;
}

.textbox-superwide
{
	width:350px;
}

/* ========== Text Styles ========== */

p,
div.p
{
	margin-top:10px;
	margin-bottom:10px;
}

ul
{
	list-style-type: disc;
	/*list-style-position:inside;*/
	/*text-indent:-15px;*/
	margin-left:30px;
	margin-top:5px;
	margin-bottom:5px;
	line-height:1.4em;
}

a
{
	text-decoration:none;
	color: rgb(150,0,150);
}

a:hover
{
	text-decoration:underline;
	color: rgb(150,0,150);
}


h1  
{
	font-size: 16pt; 
	color: rgb(0, 0, 100); 
	margin-top:5px;
	margin-bottom:12px;
}
h2  
{
	font-size: 12pt; 
	color: rgb(0, 69, 131); 
	margin-top:5px;
	margin-bottom:12px;
}
h3  
{
	font-size: 9pt; 
	font-weight:bold; 
	margin-top:5px;
	margin-bottom:4px;
}

.small-print
{
	font-size: 8pt;
}

.no-results
{
	font-style:italic;
	color:Red;
}

.search-instruction
{
	font-style:italic;
}

.findOutMore
{
	padding-left:10px;
}

.offerTypes img
{
	padding-left:5px;
	padding-bottom:16px;
	padding-top:6px;
}

.mid-title
{
	padding-top:20px;
}

/* ========== Expander sections ========== */

div.hide-show-panel
{
}

div.hide-show-panel div.hide-show-header
{
	cursor: pointer;
	text-decoration: underline;
	padding-bottom:5px;
}

/* ========== Standardised page layouts ========== */


div.single-column-layout,
div.image-text-layout,
div.menu-picture-text-layout,
div.menu-text-picture-layout,
div.search-layout
{
	margin-right:30px; 
	margin-left:50px; 
}

div.script-tagline
{
	position:relative;
	top:-10px;
	text-align: center;
	height:98px;
}

/* ========== single-column-layout ========== */

div.single-column-layout
{
	margin-right:60px;
}

div.single-column-layout     .single-column-text,
div.image-text-layout        .single-column-text,
div.menu-picture-text-layout .single-column-text,
div.menu-text-picture-layout .single-column-text,
div.search-layout            .single-column-text
{
	margin-right:70px;
	margin-bottom:20px;
	top:0px;
}

/* ========== image-text-layout (2 column) ========== */

div.image-text-layout div.left-panel,
div.search-layout div.left-panel
{
	display:inline; 
	float:left; 
	width:290px; 
	background-repeat:no-repeat;
	/*white-space:nowrap;*/
	overflow:hidden;
}

div.image-text-layout div.left-panel>img
{
	padding-bottom:10px;
}

div.image-text-layout div.right-panel,
div.search-layout div.right-panel
{
	float:right; 
	width:450px;
	padding-right:60px;
}

div.image-text-layout div.offer-panel,
div.search-layout div.offer-panel
{
	float:right;
	overflow:hidden;
	width:510px;
}

/* ========== search-layout (2 column) ========== */

div.search-layout div.left-panel
{
	width:250px;
}

div.search-layout div.right-panel
{
	width:450px;
	padding-right:90px;
}

div.search-layout div.offer-panel
{
	width:510px;
	padding-right:30px;
}

/* ========== menu-picture-text-layout (3 column) ========== */

div.menu-picture-text-layout div.left-panel, 
div.menu-text-picture-layout div.left-panel 
{
	clear: both;
	display: inline;
	float: left;
	width: 210px;
}

div.menu-picture-text-layout div.right-panel, 
div.menu-text-picture-layout div.right-panel
{
	display: inline;
	float: right;
	width: 590px;
}

div.menu-picture-text-layout div.center-panel,
div.menu-text-picture-layout div.center-panel
{
	float: left;
	display: inline;
	width:300px;
	overflow:hidden;
}

div.menu-picture-text-layout div.far-right-text,
div.menu-text-picture-layout div.far-right-text
{
	float: right; 
	width: 260px; 
	padding-left: 0px; 
	padding-bottom: 10px; 
	display: inline;
}

/* ========== menu-text-picture-layout (3 column) ========== */

div.menu-text-picture-layout div.left-panel 
{
	width: 270px;
}

div.menu-text-picture-layout div.right-panel 
{
	width: 530px;
}

div.menu-text-picture-layout div.center-panel
{
	width:320px;
}

div.menu-text-picture-layout div.far-right-text
{
	width: 180px; 
}

/* ========== Master Page ========== */

table.header
{
	width:900px;
}

table.header td.logo-and-account-menu
{
	vertical-align:top;
	width:100%;
	padding-top:10px;
	text-align:right;
	background: white no-repeat;
}

table.header td.logo-and-account-menu *
{
	margin:5px;
}