/*
############################################################
# GLITCH AND BUG FIXES
############################################################
*/
.clearfix
{
	display: inline-block;
}

/*
############################################################
# GENERIC CLASSES
############################################################
*/
body
{
	background-color: #F2F2F2;
}
.left
{
	display: block;
	float: left;
}

.right
{
	display: block;
	float: right;
}

a
{
	color: #6d6d6d;
}

a:hover
{
	color: #00aeef;
}

p
{
	margin-bottom: 10px;
}

strong
{
	font-weight: bold;
}

/*
############################################################
# BASIC FRAMEWORK
############################################################
*/
div.container
{
	width: 800px;
	padding: 0px 10px;
	margin: 0px auto;
	background-image: url(Images/Page.gif);
	background-repeat: repeat-y;
	color: #6d6d6d;
	font-family: Arial, Helvetica, Verdana, Sans-Serif;
	clear: both;
	font-size: 0.78em;
}

div.container div.header
{
	padding: 30px 25px 15px 30px;
}

div.container div.backgroundDiv
{
	background-image: url(Images/Content.gif);
	background-repeat: repeat-y;
}

div.container div.backgroundDiv div.leftColumn
{
	width: 525px;
	float: left;
}

div.container div.backgroundDiv div.rightColumn
{
	width: 275px;
	float: left;
}



/*
############################################################
# RIGHT COLUMN PANELS
############################################################
*/
div.container div.backgroundDiv div.rightColumn div.rightColumnPromos
{
	background-color: #f0f0f0;
	padding-left: 10px;
	padding-top: 10px;
	height: 267px;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent
{
	padding: 10px 10px 10px 12px;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.callBack
{
	border-bottom: 1px solid #e7e7e7;
	padding: 0px 10px;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.callBack p.shade
{	
	background-color: #f0f0f0;
	padding: 3px;
	
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.callBack input.callBack
{
	width: 130px;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.callBack label.callBack
{
	display: block;
	float: left;
	width: 90px;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.asSeenOnTV
{
	border-bottom: 1px solid #e7e7e7;
	padding: 10px 10px 5px 80px;
	background-color: #f0f0f0;
	background-image: url(Images/TV.jpg);
	background-repeat: no-repeat;
	background-position: left top;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.asSeenOnTV h3
{
	margin-bottom: 0px;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.newsSummary
{
	border-bottom: 1px solid #e7e7e7;
	padding: 10px;
}

div.container div.backgroundDiv div.rightColumn div.rightColumnContent div.newsSummary h3
{
	margin-bottom: 0px;
}


/*
############################################################
# NAVIGATION
############################################################
*/

div.container ul.mainNavigation
{
	list-style: none;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 10px;
	border-bottom: 1px solid #e7e7e7;
}

div.container ul.mainNavigation li
{
	float: left;
	margin-right: 1px;
}

div.container ul.mainNavigation li a
{
	color: #fff;
	text-decoration: none;
	display: block;
	text-align: center;
	height: 20px;
	padding-top: 9px;
	background-position: bottom;
	background-repeat: no-repeat;
	font-size: 0.85em;
	font-weight: bold;
}

div.container ul.mainNavigation li a.home
{
	width: 65px;
	background-image: url(Images/navi-home-off.jpg);
}

div.container ul.mainNavigation li a.home:hover
{
	width: 65px;
	background-image: url(Images/Navi-Home-On.jpg);
}

div.container ul.mainNavigation li a.WorkWear
{
	width: 80px;
	background-image: url(Images/Navi-work-wear-Off.jpg);
}

div.container ul.mainNavigation li a.WorkWear:hover
{
	width: 80px;
	background-image: url(Images/Navi-Work-Wear-on.jpg);
}

div.container ul.mainNavigation li a.Promotion
{
	width: 140px;
	background-image: url(Images/Navi-promotinal-printing-Off.jpg);
}

div.container ul.mainNavigation li a.Promotion:hover
{
	width: 140px;
	background-image: url(Images/Navi-promotinal-printing-On.jpg);
}

div.container ul.mainNavigation li a.schools
{
	width: 130px;
	background-image: url(Images/Navi-Schooluniform-off.jpg);
}

div.container ul.mainNavigation li a.schools:hover
{
	width: 130px;
	background-image: url(Images/Navi-Schooluniform-on.jpg);
}

div.container ul.mainNavigation li a.sports
{
	width: 100px;
	background-image: url(Images/Navi-sports-off.jpg);
}

div.container ul.mainNavigation li a.sports:hover
{
	width: 100px;
	background-image: url(Images/Navi-sports-on.jpg);
}

div.container ul.mainNavigation li a.Personalised
{
	width: 150px;
	background-image: url(Images/Navi-personalised-printing-off.jpg);
}

div.container ul.mainNavigation li a.Personalised:hover
{
	width: 150px;
	background-image: url(Images/Navi-personalised-printing-on.jpg);
}

div.container ul.mainNavigation li a.contact
{
	width: 105px;
	background-image: url(Images/Navi-stag-off.jpg);
}

div.container ul.mainNavigation li a.contact:hover
{
	width: 105px;
	background-image: url(Images/Navi-stag-on.jpg);
}



/*
############################################################
# SUB AND SECONDARY NAVIGATION
############################################################
*/
div.otherNav
{
	border-bottom: 1px solid #e7e7e7;
}

ul.adminNavigation
{
	float: left;
	list-style: none;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 10px;
	border-top: 1px solid #e7e7e7;
	width: 790px;

}

div.container ul.subNavigation
{
	width: 400px;
	float: left;
	list-style: none;
	margin: 0px 0px 0px 0px;
	padding: 0px 0px 0px 10px;
}

div.container ul.subNavigation li, ul.adminNavigation li
{
	float: left;
	padding: 10px;
	border-right: 1px solid #e7e7e7;
}

div.container ul.subNavigation li a, div.container ul.secondaryNavigation li a, ul.adminNavigation li a
{
	text-decoration: none;
	color: #6d6d6d;
	font-weight: bold;
}

div.container ul.subNavigation li a:hover, div.container ul.secondaryNavigation li a:hover, ul.adminNavigation li a:hover
{
	text-decoration: underline;
	color: #00aeef;
	font-weight: bold;
}

div.container ul.secondaryNavigation
{
	float: right;
	list-style: none;
	margin: 0px 0px 0px 0px;
	padding: 0px 10px 0px 0px;
}

div.container ul.secondaryNavigation li
{
	float: left;
	margin-right: 3px;
	padding: 10px 1px;

}
div.container ul.secondaryNavigation li a, div.container ul.secondaryNavigation li a:hover
{
	font-weight: normal;
}



/*
############################################################
# FOOTER
############################################################
*/
div.footer
{
	border-top: 1px solid #e7e7e7;
	padding: 10px;
	clear: both;
}

div.footer a
{
	text-decoration: none;
	color: #6d6d6d;
}

div.footer a:hover
{
	text-decoration: underline;
	color: #00aeef;
}

div.footer div.footerLeft
{
	width: 390px;
	float: left;
	margin-bottom: 20px;
}

div.footer div.footerRight
{
	width: 390px;
	float: right;
	margin-bottom: 20px;
	text-align: right;
}

div.footer div.wealthWarning p
{
	text-align: center;	
	margin-bottom: 5px;
}



/*
############################################################
# LOAN CALCULATOR
############################################################
*/
div.loanCalculator
{
	color: #fff;
	background-image: url(Images/Loan-Calculator.gif);
	background-repeat: no-repeat;
	width: 235px;
	height: 71px;
	padding-top: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
}

div.loanCalculator label
{
	font-weight: bold;
	display: block;
	float: left;
	width: 120px;
}

div.loanCalculator input.field, div.loanCalculator select
{
	display: block;
	float: left;
	width: 105px;
}

div.loanCalculator p
{
	margin-bottom: 5px;
}



/*
############################################################
# BUDGET PLANNER AND APPLY NOW
############################################################
*/
div.budgetCalculator, div.applyNow
{
	margin-top: 10px;
}



/*
############################################################
# HEADINGS
############################################################
*/
h1
{
	font-size: 1.8em;
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 10px;
	
}

h1 a, h1 a:hover
{
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 20px;
	width: 300px;
}

h2
{
	font-size: 1.5em;
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 10px;
	text-decoration: none;
}

h2 a, h2 a:hover
{
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 10px;
	text-decoration: none;
}

h3
{
	font-size: 1.2em;
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 10px;
	text-decoration: none;
}

h3 a, h3 a:hover
{
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 10px;
	text-decoration: none;
}

h4
{
	font-size: 1.2em;
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 10px;
	text-decoration: none;
}

h4 a, h4 a:hover
{
	font-weight: bold;
	color: #00aeef;
	margin-bottom: 10px;
	text-decoration: none;
}


/*
############################################################
# PAGE HEADERS
############################################################
*/
div.pageHeader
{
	width: 485px;
	height: 237px;
	background-color: #F0F0F0;
	background-repeat: no-repeat;
	background-position: right bottom;
	padding: 20px;
}

div.pageHeader a.button
{
	display: block;
	float: left;
	margin-right: 10px;
	margin-top: 10px;
}

div.pageHeader p
{
	font-weight: bold;
	width: 270px;
}

div.pageHeaderHome
{
	background-image: url(Images/Home.jpg);
}
div.pageHeaderpersonalised
{
	background-image: url(Images/Home.jpg);
}
div.pageHeaderSports
{
	background-image: url(Images/sports.jpg);
}
div.pageHeaderworkwear
{
	background-image: url(Images/workwearhome.jpg);
}

div.pageHeaderNews
{
	background-image: url(Images/News.jpg);
}


div.pageHeaderContact
{
	background-image: url(Images/Contact.jpg);
}



/*
############################################################
# BREADCRUMB NAVIGATION
############################################################
*/
div.pageHeader p.breadCrumb
{
	margin: 0px 0px 10px 0px;
	font-size: 0.8em;
	width: 450px;
}

div.pageHeader p.breadCrumb a
{
	text-decoration: underline;
	color: #6d6d6d;
}

div.pageHeader p.breadCrumb a:hover
{
	text-decoration: none;
}


/*
############################################################
# HOME PAGE PANELS
############################################################
*/
div.homePanel
{
	margin-left: 10px;
	padding: 10px 10px 10px 120px;
	background-repeat: no-repeat;
	background-position: left top;
}

div.homePanelHomeOwner
{
	background-image: url(Images/TShirt-Icon.jpg);
}

div.homePanelConsolidation
{
	background-image: url(Images/workwear-Icon.jpg);
}

div.homePanelSecured
{
	background-image: url(Images/sportswear-Icon.jpg);
	background-color: #f0f0f0;
}




/*
############################################################
# CONTENT PAGES
############################################################
*/
div.container div.backgroundDiv div.leftColumn div.leftColumnContent
{
	padding: 10px 10px 10px 20px;	
}

div.container div.backgroundDiv div.leftColumn div.leftColumnContent ul.list
{
	list-style-type: disc;
	padding-left: 40px;
}

div.container div.backgroundDiv div.leftColumn div.leftColumnContent ul.list li
{
	list-style-type: disc;
	margin-bottom: 10px;
}



/*
############################################################
# GLOSSARY
############################################################
*/
div.glossaryLetters
{
	margin-bottom: 20px;
}

div.glossaryLetters a
{
	color: #00aeef;
	font-size: 1.2em;
	font-weight: bold;
}



/*
############################################################
# BUDGET CALCULATOR
############################################################
*/
table.budgetTable
{
	width: 100%;
}

table.budgetTable th, table.budgetTable td
{
	padding: 3px;
}

table.budgetTable th
{
	width: 150px;
	font-weight: bold;
}

table.loanTable
{
	width: 100%;
}

table.loanTable th, table.loanTable td
{
	padding: 3px;
}

table.loanTable th
{
	font-weight: bold;
}




/*
############################################################
# VALIDATION
############################################################
*/
.valSummary
{
	background-color: #00aeef;
	color: #fff;
	padding: 5px;
	margin-bottom: 10px;
}

.valSummary strong
{
	display: block;
	margin-bottom: 10px;
}

.valSummary ul
{
	list-style-type: disc;
	padding: 0;
	margin: 0;	
}




/*
############################################################
# APPLICATION FORM
############################################################
*/

ul.applicationProgress
{
	list-style: none;
	list-style-type: none;
	width: 100%;
	margin: 0px 0px 10px 0px;
	padding: 0px;
}

ul.applicationProgress li
{
	float: left;
	width: 122px;
	height: 30px;
	background-image: url(Images/App-Tab-On.gif);
	background-repeat: no-repeat;
	text-align: center;
	margin: 0px;
	padding: 0px;
	list-style: none;
	list-style-type: none;
}

ul.applicationProgress li a
{
	display: block;
	width: 118px;
	height: 23px;
	padding-top: 7px;
	color: #00aeef;
	text-decoration: none;
	font-weight: bold;
}

ul.applicationProgress li.notAvailable, ul.applicationProgress li.previous
{
	background-image: url(Images/App-Tab-Off.gif);
}

ul.applicationProgress li.notAvailable a
{
	color: #6d6d6d;
}

label.Application
{
	display: block;
	width: 250px;
	float: left;
}

input.Application, select.Application, textarea.Application
{
	font-family: Arial, Helvetica, Verdana, Sans-Serif;
	width: 200px;
}




/*
############################################################
# SITE MAP
############################################################
*/
div.siteMap h2 a
{
	text-decoration: none;
}

div.siteMap ul
{
	margin-left: 15px;
	margin-bottom: 30px;
}


/*
############################################################
# ADMIN CLASSES
############################################################
*/
div.admin
{
	padding: 10px 20px;
}

div.admin h1
{
	width: 600px;
}

div.admin p.confirmation
{
	font-size: 1.3em;
	font-weight: bold;
	padding: 10px;
	background-color: #009400;
	color: #fff;
}

div.admin table.admin
{
	width: 760px;
	border-collapse: collapse;
	border: none;
	margin-bottom: 10px;
}

div.admin table.admin th, div.admin table td
{
	padding: 3px;
	border: none;
}

div.admin table.admin th
{
	background-color: #00aeef;
	color: #fff;
	font-weight: bold;
}

div.admin input.Application, div.admin select.Application, div.admin textarea.Application
{
	width: 400px;
}


div.admin table.admin tr.alt td
{
	background-color: #f0f0f0;
}

table.RADEWrapper
{
	width:450px;
}

/*
############################################################
# AJAX PROGRESS BAR CLASSES
############################################################
*/

.updateProgress {
    border-width:1px; 
    border-style:solid; 
    background-color:#CCCCCC; 
    position:absolute; 
    width:130px; 
    height:50px;    
}
.updateProgressMessage {
    margin:3px; 
    font-family:Trebuchet MS; 
    font-size:small; 
    vertical-align: middle;
}
.background {
    background-color:gray; 
    filter:alpha(opacity=10); 
    opacity:0.1; 
}

.admintable
{
   width:500px; 
}

.rowtitle
{
    vertical-align:top;
    width:150px;
}

.tinyinput
{
    width:30px;
}
.smallinput
{
    width:75px;
}
.mediuminput
{
    width:150px;
}
.largeinput
{
    width:250px;
}
.fullwidthinput
{
    width:100%;
}

.disabled
{
    border:none;
    background-color:#EBEBEB;
    color:#333333;
    padding:2px;
}