/*
========================================
	Secondary Navigation
========================================
*/

#secondary-nav {
	float: right;
	padding: 45px 0 0 0;
	font-size: 1em;
}

	#secondary-nav ul,
	#secondary-nav ul li,
	#secondary-nav a {
		float: left;
		list-style: none;
	}
	
		#secondary-nav ul li {
			padding: 2px 0;
		}
		
			#secondary-nav a {
				padding: 2px 7px;
				display: block;
				color: #6d6d6d;
				background: url("images/secondary_nav_divider.png") no-repeat center right;
				text-decoration: none;
			}
			
			/* \*/
			* html #secondary-nav a {
				height: 1px;
			}
			/* */
			
			#secondary-nav .home-link a {
				color: #333399;
			}
			
			#secondary-nav a:hover,
			#secondary-nav a:focus, 
			#secondary-nav a:active {
				text-decoration: underline;
			} 
		
		
			#secondary-nav li#view-basket a {
				padding-left: 20px;
			}
		
		
		#secondary-nav li#sign-out a {
			color: #000;
			font-weight: bold;
			padding-left: 19px;
		}		

/*
========================================
	Global/Top Navigation
========================================
*/
	

/*
========================================
	Local nav general
========================================
*/



	#local-nav {

	}

/*
========================================
	Local nav - level 2
========================================
*/

/*
========================================
	Local nav - level 3
========================================
*/		
#local-nav ul ul {
	background: #f1f1f1;
	margin: 0;
	border: none;
}
	
	#local-nav ul ul li {
		background: url("images/local-nav_divider.gif") no-repeat top left;
		padding: 1px 0 0 0;
	}
		
		#local-nav ul li.active ul li a,
		#local-nav ul li.active ul li strong {
			color: #3d3d3d;
			padding: 8px 5px 8px 35px;
			background: url("images/local-nav_l3.gif") no-repeat top left;
			font-weight: normal;
		}
		
		

		
		#local-nav ul li.active ul li a:hover,
		#local-nav ul li.active ul li a:focus,
		#local-nav ul li.active ul li a:active {
			background: #FFF url("images/local-nav_l3.gif") no-repeat top left;
			color: #3d3d3d;
		}
		
		#local-nav ul li.active ul li.current-active-link strong,
		#local-nav ul li.active ul li.current-active-link a {
			background: #FFF url("images/local-nav_l3_active.gif") no-repeat top left;
			color: #fe0103;
			border-color: #FFF;
		}
		
		#local-nav ul li.active ul li.active strong,
		#local-nav ul li.active ul li.active a {
			background: #FFF url("images/local-nav_l3.gif") no-repeat top left;
		}
		

/*
========================================
	Local nav - level 4
========================================
*/		
#local-nav ul ul ul {
	background: #FFF;
	margin: 0;
	border: none;
}

	#local-nav ul ul ul li {
		background: url("images/local-nav_divider.gif") no-repeat top left;
		padding: 1px 0 0 0;
	}

		#local-nav ul li.active ul li.active ul li a,
		#local-nav ul li.active ul li.active ul li strong {
			color: #595959;
			padding: 8px 5px 8px 50px;
			background: url("images/local-nav_l4.gif") no-repeat top left;
			border-color: #DDD;
		}

		#local-nav ul li.active ul li.active ul li a:hover,
		#local-nav ul li.active ul li.active ul li a:focus,
		#local-nav ul li.active ul li.active ul li a:active {
			background: #FFF url("images/local-nav_l4.gif") no-repeat top left;
			color: #F00;
		}

		#local-nav ul li.active ul li.active ul li.active strong,
		#local-nav ul li.active ul li.active ul li.active a {
			background: #FFF url("images/local-nav_l4_active.gif") no-repeat top left;
			color: #fe0103;
			border-color: #FFF;
		}
		
		

/*
========================================
	Top 5 Footer Navigation
========================================
*/


/*
========================================
	Tabbed navigation
========================================
*/

.tabs {
	width: 100%;
	float: left;
	background: #FFF;
}

	#content-area .tabs ul,
	#content-area .tabs ul li {
		float: left;
		list-style: none;
		background: none;
	}
	
	.tabs ul {
		margin: 10px 0 0 10px;
	}

		.tabs ul li {
			padding: 0 1px 0 0;
		}
		
			.tabs ul li a,
			.tabs ul li strong {
				float: left;
				display: block;
				padding: 0 0 0 1px;
			}
			
			.tabs ul li.active a,
			.tabs ul li.active strong {
				font-weight: bold;
				text-decoration: none;
				color: #333;
			}
			
				.tabs ul li a span,
				.tabs ul li strong span {
					padding: 2px 4px;
					display: block;
				}
				
				.tabs ul li.active a span,
				.tabs ul li.active strong span {
					padding-bottom: 3px;
					margin: 0 0 -1px 0;
				}


/*
========================================
	tabs - type a
========================================
*/

.tabs-a ul li a,
.tabs-a ul li strong {
	background: url("images/tab_current.gif") no-repeat top left;
}

.tabs-a ul li.active a,
.tabs-a ul li.active strong {
	background: url("images/tab.gif") no-repeat top left;
}

	.tabs-a ul li a span,
	.tabs-a ul li strong span {
		background: url("images/tab_current.gif") no-repeat top right;
	}

	.tabs-a ul li.active a span,
	.tabs-a ul li.active strong span {
		background: url("images/tab.gif") no-repeat top right;
	}


/*
========================================
	tabs - type b
========================================
*/

.tabs-b ul li a,
.tabs-b ul li strong {
	background: url("images/tab.gif") no-repeat top left;
}

.tabs-b ul li.active a,
.tabs-b ul li.active strong {
	background: url("images/tab_current.gif") no-repeat top left;
}

	.tabs-b ul li a span,
	.tabs-b ul li strong span {
		background: url("images/tab.gif") no-repeat top right;
	}

	.tabs-b ul li.active a span,
	.tabs-b ul li.active strong span {
		background: url("images/tab_current.gif") no-repeat top right;
	}


/*
========================================
	Gallery page boxes - fully clickable
========================================
*/

.fully-clickable {
	background: #eaeaea url("images/gallery_corner.png") no-repeat top left;
}

.fully-clickable a {
	text-decoration: none;
	display: block;
	color: #000;
}

	.fully-clickable a strong {
		display: block;
		font-size: 1.4em;
		padding: 8px 5px 5px;
		text-decoration: underline;
	}


	.fully-clickable a span {
		display: block;
		padding: 0 4px 3px;
	}
		
	.fully-clickable a span strong {
		display: inline;
		padding: 0;
		font-size: 1em;
		text-decoration: none;
		color: inherit;
	}


.content-page .fully-clickable {
	margin-left: 50px;
	margin-right: 150px;
	padding: 5px 10px;	
}

.coloured-content .fully-clickable {
	margin-right: 60px;
}


	.content-page .fully-clickable a strong {
		color: #009ee0;
	}

		
	.fully-clickable a:hover span strong {
		text-decoration: none;
	}

/*
========================================
	Gallery page boxes - large and small boxes
========================================
*/


.large-box,
.small-box,
.gallery-photo,
.expandable-box {
	background: #eaeaea;
	margin: 0 0 10px 0;
}

.large-box a strong,
.small-box a strong,
.expandable-box a strong {
	text-decoration: none;
}

.gallery-photo {
	line-height: 0em;
	background: none;
}

	.large-box a {
		min-height: 130px;
		display: block;
	}

	* html .large-box a {
		height: 130px;
	}

		.large-box img {
			float: left;
			padding: 10px 10px 0 10px;
		}
	
		.large-box a strong {
			color: #FFF;
			padding: 14px 0 5px;
		}
		

.small-box,
.expandable-box {
	background: #eaeaea url("images/gallery_corner.png") no-repeat top left;
}

	.small-box a {
		min-height: 100px;
		display: block;
	}

	* html .small-box a {
		height: 100px;
	}
	
	.expandable-box a {
		display: block;
		padding-bottom: 10px;
	}

		.small-box a strong,
		.expandable-box a strong {
			padding: 17px 8px 4px 12px;
			color: #009ee0;
			font-weight: bold;
		}
		
		
		.small-box a span,
		.expandable-box a span {
			padding: 0 12px;
		}




/*
========================================
	Gallery page boxes - coloured boxes
========================================
*/

.green-box {
	background: #89bb0a;
}

.pink-box {
	background: #d790bc;
}

.orange-box {
	background: #f6a300;
}


/*
========================================
	Gallery page promo images
========================================
*/

.content-banner {
	margin: 0 0 10px 0;
	float: left;
}

	.content-banner img {
		display: block;
	}

/*
========================================
	Gallery page footer promo
========================================
*/
.footer-banner {
	text-align: right;
}

/*
========================================
	Current offer tabs
========================================
*/

#prepay-paymonthly-tabs-wrapper {
	position: relative;
}

	#prepay-paymonthly-tabs {
		position: absolute;
		top: -42px;
		left: -29px;
		width: 562px;
		height: 46px;
	}

		#prepay-paymonthly-tabs ul,
		#prepay-paymonthly-tabs ul li {
			list-style: none;
			float: left;
		}

		#prepay-paymonthly-tabs ul {
			width: 562px;
			margin: 0;
		}

			#prepay-paymonthly-tabs ul li {
				float: left;
				min-height: 40px;
				background: url("images/current_offers_tab_inactive.png") no-repeat top left;
				padding: 0 0 0 14px;
				margin: 0;
			}
			
			* html #prepay-paymonthly-tabs ul li {
				height: 40px;
			}
			
				#prepay-paymonthly-tabs ul li a,
				#prepay-paymonthly-tabs ul li strong {
					display: block;
					padding: 12px 19px 0 5px;
					font-size: 1.3em;
					text-decoration: none;
					font-weight: bold;
				}
			
			
				#prepay-paymonthly-tabs ul li a {
					background: url("images/current_offers_tab_inactive.png") no-repeat top right;
					color: #FFF;
					display: inline; 
					float: left;
				}
	
			
			#prepay-paymonthly-tabs ul li.active {
				background: url("images/current_offers_tab_active.png") no-repeat top left;
			}
	
			
				#prepay-paymonthly-tabs ul li strong {
					background: url("images/current_offers_tab_active.png") no-repeat top right;
					color: #F00;
					display: inline; 
					float: left;
				}

			#prepay-paymonthly-tabs ul li#prepay-tab {
				
			}

			#prepay-paymonthly-tabs ul li#paymonthly-tab {
		    	margin: 0 0 0 4px;
			}
			


/*
========================================
	Content pages, show/hide functionality
========================================
*/

.show-hide-pane {

}

.show-hide-link {
	font-size: 100%;
	text-align: right;
}

.show-hide-pane-wrapper {
	
}

.selected-show-hide-pane-wrapper {
	background: #FFF;
	border: 10px solid #0099da;
	padding: 0 10px 0 0;
	margin: 0 0 0 15px;
}

	.selected-show-hide-pane-wrapper h2 {
		margin: 3px 0 0 0;
		padding-left: 10px;
	}
	
	#content-area .selected-show-hide-pane-wrapper p {
		padding-left: 10px;
	}
	
	#content-area .selected-show-hide-pane-wrapper h3 {
		padding-left: 10px;
	}
	
	#content-area .selected-show-hide-pane-wrapper ul li {
		margin-left: 30px;
	}
	
	.selected-show-hide-pane-wrapper table {
		margin-left: 10px;
	}


/*
========================================
	Help Tool Launcher
========================================
*/


#help-tool {
	background: #0099da;
	color: #FFF;
	padding-bottom: 13px;
}

	#help-tool h2 {
		margin: 0;
		padding: 12px 11px;
		color: #FFF;
		font-size: 1.5em;
		line-height: 1.2em;
	}
	
	#content-area #help-tool p {
		padding: 0 11px 0;
		line-height: 1.1em;
		margin: 0;
	}
	
	#help-tool #help-tool-launcher {
		padding: 10px 0;
		text-align: center;
	}
	
		#help-tool #help-tool-launcher p {
			padding: 0;
		}
	
			#help-tool #help-tool-launcher a {
				background: url("images/help_support_help_center_icon.png") no-repeat top center;
				display: block;
				padding: 50px 0 0 0;
				color: #FFF;
				font-weight: bold;
			}

		#help-tool #help-tool-launcher p.sub-text {
			color: #7ed5fa;
			font-size: 0.9em;
		}



/*
========================================
	Individual Top Questions
========================================
*/

.top-question-wrapper {
	padding: 14px 0;
	margin: 0 25px;
	background: url("images/help_support_dottedline.png") repeat-x top left;
}

	#content-area .top-question-answer p {
		padding: 8px 20px;
		margin: 0;
	}

/*
========================================
	Selected top question
========================================
*/

.selected-question {
	background: #FFF;
	border: 10px solid #0099da;
	margin: 0;
	padding: 14px 0;
}

	.selected-question h3,
	.selected-question .top-question-answer {
		padding: 0 15px;
		margin: 0;
	}


/*
========================================
	Make this your vf homepage
========================================
*/

#make-this-your-vf-homepage-wrapper {
	position: relative;
}


	#make-this-your-vf-homepage {
		position: absolute;
		top: 84px;
		left:0;
		width: 751px;
		text-align: right;
	}
	
		* html #make-this-your-vf-homepage {
		width: 654px;
	}
	
		#make-this-your-vf-homepage a {
			color: #8e8e8e;
			text-decoration: none;
		}
		
		#make-this-your-vf-homepage a:hover,
		#make-this-your-vf-homepage a:focus,
		#make-this-your-vf-homepage a:active {
			text-decoration: underline;
		}

/*
========================================
	Handset support lookup
========================================
*/

#handset-support-lookup	{
	width: 100%;
	float: left;
	margin: 10px 0;
}

	#handset-support-lookup	.form-row {
		width: 100%;
		float: left;
		margin: 0 0 5px 0;
	}

		#handset-support-lookup	.form-label {
			width: 100px;
			float: left;
			text-align: right;
		}
	
		#handset-support-lookup	.form-input {
			width: 130px;
			float: left;
			margin-left: 10px;
		}
		
			#handset-support-lookup	.form-input select {
				width: 150px;
			}
		
		#handset-support-lookup	.form-btn {
			float: left;
			margin: 0 0 0 110px;
		}
		
		* html #handset-support-lookup	.form-btn {
			display: inline;
		}

/*
========================================
	Handset support detail page
========================================
*/

#phone-support-wrapper {
	width: 503px;
	float: left;
}

	#phone-support-wrapper #phone-support-info {
		width: 340px;
		float: left;
	}
	
		#phone-support-wrapper #phone-support-info h2 {
			margin-top: 0;
			padding-top: 0;
			padding-bottom: 10px;
		}
		
	#phone-support-wrapper #phone-image {
		width: 150px;
		float: right;
	}	
	
	
/*
========================================
	Standard content Bríd
========================================
*/

#standard-content #content-area .fully-clickable {
	width:360px;
	margin-left:auto;
	margin-right:auto;
	padding: 5px 10px 15px 10px;	
}

/*
========================================
	Customer type screen
========================================
*/

.choose-customer-type {
	padding: 50px 0 0 0;
	background: #007EC9;
}

.choose-customer-type h2 {
	font-size: 1.6em;
	padding: 0;
	margin: 0;
}

	.choose-customer-type h2 a {
		color: #FFF;
		padding: 5px 10px 15px 95px;
		font-weight: bold;
		line-height: 1.3em;
		min-height: 80px;
		text-decoration: none;
		display: block;
	}
	
	* html .choose-customer-type h2 a {
		height: 80px;
	}
		
		.choose-customer-type h2 a:hover,
		.choose-customer-type h2 a:focus,
		.choose-customer-type h2 a:active {
			color: #FFF;
		}
		
			.choose-customer-type h2 a strong {
				display: block;
				padding: 0 0 7px 0;
				text-decoration: none;
			}
			
			.choose-customer-type h2 a:hover strong,
			.choose-customer-type h2 a:focus strong,
			.choose-customer-type h2 a:active strong {
				text-decoration: underline;
			}
			
			
			.choose-customer-type h2 a span {
				display: block;
				font-weight: normal;
				font-size: 0.7em;
				line-height: 1.2em;
			}

	.customer-type-wrapper {
		background: #13B2F4 url("images/shop_customer-type_dottedline.png") repeat-x top left;
	}
	
		.choose-customer-type .customer-type-wrapper {
				padding: 0 18px 0;
				min-height: 130px;
				margin: 10px 0 0;
			}
	
		* html .choose-customer-type .customer-type-wrapper {
			height: 130px;
		}

			#content-area .customer-type-wrapper ul {
				padding: 12px 0;
				margin: 0;
				font-size: 1.1em;
				color: #FFF;
			}
			
			#content-area .customer-type-wrapper ul li {
				margin: 0;
				background: url("images/bullet-point_white.gif") no-repeat 0 0.5em;
			}

#choose-customer-type-help-wrapper {
	clear:both;
	width: 100%;
	float: left;
	margin-top: 10px;
}



	#choose-customer-type-help {
		border: 10px solid #009ee0;
		padding: 16px 17px;

	}

		#choose-customer-type-help h2 {
			color: #009ee0;
			margin: 0;
			padding: 0;
		}

		#content-area #choose-customer-type-help p {
			padding: 0;
			margin: 0;
		}

			#choose-customer-type-help a {
				color: #0077b7;
			}