/* 
********************************************************

	Title: Global styles for Essentially Storage 
	Author: Pete Eveleigh - Earl & Thompson Marketing
	
********************************************************
*/



	body {
		background:url(../graphics/essentiallystorage/bodybg.gif) top left repeat-x #fff;
		font-family:helvetica, arial, sans-serif;
		font-size:62.5%;
		line-height:1.4;
	}
	
	
	abbr {
		border-bottom:1px dotted;
	}
	
	a:link, a:visited {
		color:#005DAB
	}
	
	a:hover, a:active {
		color:#ca0020;
	}
	
	h2, h3, h4, h5 {
		color:#005DAB;
		font-weight:bold;
	}
	
		h2 {
			font-size:200%;
		}
		
		h3 {
			font-size:150%;
		}
		
		h4 {
			font-size:120%;
		}
	
	
	/************************************/
	/* 			Specific IDs			*/
	
	#skip {
		position:absolute;
		left:-500em;
	}
	
	#wrapper {
		background-color:transparent;
		margin:0 auto;
		width:980px;
		font-size:120%;
	}
	
	
	#header {
		background-color:#fff;
		width:980px;
		margin-top:35px;
	}
	
		#logo {
			float:left;
		}
		
		#headcontact {
			float:right;
			margin-top:8px;
		}
		
		/* Navigation bar */
		
		#topnav {
			float:left;
			width:964px;
			padding:0 8px;
			height:53px;
			margin-top:8px;
			background:url(../graphics/essentiallystorage/topnavbg.gif) top left no-repeat #fff;
		}
		
			#topnav ul {
				margin:4px 0;
				float:left;
			}
			
				#topnav ul li {
					float:left;
					border-right:1px solid #9B9B9B;
					border-left:1px solid #fff;
				}
				
				
				#topnav ul li.first {
					border-left:none;
				}
				
				#topnav ul li.last {
					border-right:none;
				}
				
					#topnav ul li a {
						float:left;
						display:block;
						padding:8px 20px;
						text-decoration:none;
						color:#005DAB;
					}
					
					
			#basketbar {
				float:right;
				margin-top:6px;
			
				color:#fff;
				text-transform:uppercase;
			}
			
				#basketbar .contents {
					background:url(../graphics/essentiallystorage/basketbarbg.png) top left repeat-x #ca0020;
					-moz-border-radius:4px;
					-webkit-border-radius:4px;
					border-radius:4px;
					padding:2px 20px;
				
					float:left;
				}
			
				#basketbar h3 {
					float:left;
					border-right:1px solid #9b9b9b;
					padding:4px 10px;
					color:#fff;
					font-size:110%;
				}
				
				/*
				#basketbar span {
					float:left;
					padding:4px 10px;
				}
				*/
				
				#basketbar .items {
					float:left;
					padding:4px 5px;
					border-left:1px solid #DF6377;
				}
				
				#basketbar .value {
					float:left;
					padding:4px 5px;
				}
				
				#basketbar .checkout {
					float:right;
					margin-left:3px;
					-moz-border-radius:4px;
					-webkit-border-radius:4px;
					background:url(../graphics/essentiallystorage/basketbarcheckoutbg.png) top left repeat-x #017BC6;
					color:#fff;
					text-decoration:none;
					font-weight:bold;
				}
				
					#basketbar .checkout span {
						float:left;
						padding:7px 10px 6px 10px;
					}
				
					#basketbar .checkout img {
						float:left;
						padding:7px 10px;
					}
				
				
		
		#breadcrumbs {
			clear:left;
			padding:0 8px 4px 8px;
			font-weight:bold;
			color:#444;
		}
		
		
		
		
	/* content */
	
	#contentwrapper {
		width:960px;
		padding:10px;
		color:#fff;
		background-color:#007BCF;
	}
	
	body#home #contentwrapper {
		background:url(../graphics/essentiallystorage/flag.jpg) top left no-repeat #007BC5;
	}
	
		#intro {
			width:460px;
			padding-top:10px;
			padding-left:12px;
			float:left;
		}
		
		#intro h2 {
			font-size:230%;
			letter-spacing:1px;
			color:#fff;
		}
		
		#intro p {
			font-size:190%;
			line-height:1.2;
			font-weight:lighter;
		}
		
	
		#offer {
			position:relative;
			float:left;
			margin-left:12px;
			font-size:160%;
		}
		
			#offer img {
				position:absolute;
				top:0;
				left:0;
			}
	
		#main {
			background:url(../graphics/essentiallystorage/wrapperbgbottom.png) bottom left repeat-x #fff;
			padding:10px 10px 16px 10px;
			-moz-border-radius:4px;
			-webkit-border-radius:4px;
			border-radius:4px;
		}
		
		body#home #main {
			margin-top:220px;
		}
		
		
		#main h2 {
			font-size:220%;
			color:#005DAB;
		}
		
		
		#productarea {
			float:left;
			clear:both;
			width:705px;
			margin:12px 0;
		}
		
		
		#content {
			
		}
		
		#content p {
			margin-bottom:1em; /* added 10th Nov */
		}
		
		/***************************/
		/* Side bar and side menus */
		
			#sidebar {
				float:left;
				width:225px;
				margin-right:10px;
			}
			
				
					#searchbox label, #mailsignup label {
						display:block;
						margin-bottom:6px;
					}
					
					#searchSubmit, #signupsubmit {
						display:block;
						float:right;
					}
					
					#searchbox #searchKeyword {
						padding:2px;
						width:160px;
						font-size:110%;
					}
			
				#categories {
					background:url(../graphics/essentiallystorage/getintouchcta.jpg) bottom left no-repeat #005DAB;
					padding:10px 6px 220px 6px;
					-moz-border-radius:6px;
					-webkit-border-radius:6px;
					border-radius:6px;
					margin-bottom:8px;
				}
				
					.sidemenu {
						margin-bottom:24px;
					}
				
					.sidemenu li {
						border-bottom:1px solid #50c8e8;
					}
					
						.sidemenu li a:link, .sidemenu li a:visited {
							display:block;
							padding:4px 4px 2px 4px;
							border-bottom:1px solid #0058ab;
							color:#dedede;
							text-decoration:none;
							font-size:110%;
						}
						
						.sidemenu li a:hover, .sidemenu li a:active {
							background-color: #007BC5;
							color:#fff;
						}
						
				
				#sidepanels {
					margin-bottom:8px;
				}
				
				
				
				
				/* navSub dropdown menu - shows only when tree nav is enabled in admin > design settings */

				#navDept {
					position:relative;
				}
				
				.navSub,
				.navSub li {
				
					list-style: none;
					margin: 0;
					padding: 0;
					}
				.navSub {
					display: none;
					background-color:inherit;
					}
					
				.navSub li {
					position:relative;
				}
				#navDept li:hover .navSub {
					display: block;
					float: none;
					left: 210px;
					top: 0;
					position: absolute;
					width: 170px;
					}
				#navDept li:hover .navSub li {
					clear: left;
					display: block;
					float: none;
					position: relative;
					}
				#navDept li:hover .navSub li a {
					background: #4f7a9f;
					border-top: 0;
					display: block;
					width: 170px;
					}
				#navDept li .navSub a.selected {
					color: #cbd7e2;
					}
				#navDept li:hover .navSub li a:hover {
					background: #5a8bb6;
					color: #fff;
					}
				#navDept li:hover .navSub li .navSub {
					display: none;
					position: relative;
					}
				#navDept li:hover .navSub li:hover .navSub {
					display: block;
					float: none;
					top: 0;
					left: 194px;
					position: absolute;
					width: auto;
					}
				#navDept li:hover .navSub li:hover .navSub li .navSub {
					display: none;
					position: relative;
					}
				#navDept li:hover .navSub li:hover .navSub li:hover .navSub {
					display: block;
					float: none;
					top: 0;
					left: 194px;
					position: absolute;
					width: auto;
					}
					
					
			
			/* end sidebar and sidemenus */
			/*****************************/
			
			
			
			
			#contentmain {
				color:#333;
				float:left;
				width:705px;
				padding:10px 0 20px 0;
			}
			
			
				#panels {
					color:#0058ab;
					float:left;
					width:938px;
					clear:both;
				}
				
					#panels .panel {
						display:block;
						float:left;
						margin-right:7px;
					}
					
					#cardpanel {
						margin-right:8px !important;
					}
		
		
		
		
		/*****************************/
		
		#footer {
			clear:both;
			padding:15px 8px;
			height:5em;
		}
		
			#footer a:link, #footer a:visited {
				color:#dedede;
				text-decoration:none;
			}
			
			#footer a:hover, #footer a:active {
				color:#fff;
			}
		
			#footer ul {
				margin:0em 0 1em 0;
			}
			
			#footer ul li {
				display:inline;
				margin-right:1em;
			}
		
		
		
		
		/* Product boxes */
		
		.productbox {
			position:relative;
			float:left;
			width:209px;
			min-height:284px;
			padding:8px;
			margin-right:7px;
			margin-bottom:7px;
			border:1px solid #ccc;
			background:url(../graphics/essentiallystorage/productboxbg.png) bottom left repeat-x #fff;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
		}
		
		.deptbox {
			min-height:200px!important;
		}
		
		.productbox h3 a:link, .productbox h3 a:visited  {
			position:relative;
			color:#ca0020;
			line-height:1.25;
			font-weight:600;
			text-decoration:none;
			margin-bottom:8px;
			float:left;
			width:209px;
			height:2.75em;
			min-height:2.75em;
			z-index:99;
		}
		
			.productbox h3 a:hover, .productbox h3 a:active {
				color:#0058ab;
			}
			
		.productbox div.prodimg {
			height:180px;
			clear:left;
			overflow:hidden;
			width:225px;
			margin-left:-8px;
			text-align:center;
			background-color:#fff;
		}
		
		.productbox div.prodinfo {
			width:209px;
			height:8em;
			min-height:8em;
			float:left;
		}
		
		.deptbox div.prodinfo {
			height:1%;
			min-height:1%;
		}
		
		
			.productbox div.prodinfo .title {
				color:#0058ab;
				padding-bottom:4px;
				margin-bottom:8px;
				border-bottom:1px solid #0058ab;
				height:2.75em;
				min-height:2.75em;
			}
			
			.deptbox .title {
				border-bottom:none!important;
				height:auto;
				min-height:1px;
			}
			
			.productbox .priceinfo, .deptbox .title {
				color:#ca0020 !important;
			}
			
			.productbox .price, .deptbox .price {
				line-height:1;
				font-weight:600;
				float:right;
				font-size:250%;
			}
			
			.productbox .message, .deptbox .message {
				text-transform:uppercase;
				background-color:transparent;
				border:none;
				margin:0;
				padding:0;
				float:left;
			}
			
			.productbox .taxmessage {
				display:block;
				text-align:right;
				font-size:40%;
				font-weight:normal;
				line-height:1;
				text-transform:uppercase
			}
			
			.productbox .onSale {
				position:absolute;
				right:8px;
				top:50px;
			}
			
			.productbox .seeAll, .productbox .addCompare {
				clear:both;
			}

		
	
			
			
			/* Product page */


			#productpage {

			}
			
			
				#productpage #imageblock {
					float:left;
					width:325px;
					text-align:center;
					margin-right:12px;
					-moz-border-radius:8px;
				}

				#productpage .mainimg {
					float:left;
					width:325px;
					height:350px;
					margin-bottom:20px;
					overflow:hidden;
					text-align:center;
				}
				
				#imagegallery {
					width:325px;
					margin-top:1em;
					padding:4px 4px 4px 4px;
					text-align:left;
					clear:left;
					float:left;
				}
				
					.galleryimg a {
						float:left;
						margin:4px;
						border:1px solid #cdcdcd;
						border-bottom:1px solid #bcbcbc;
						padding:4px;
						background-color:#efefef;
						display:block;
						float:left;
					}
					
						.galleryimg a img {
							opacity:0.7;
						}
					
						.galleryimg a:hover {
							border:1px solid #999;
						}
						
						.galleryimg a:hover img {
							opacity:1;
						}


				#productpage .prodinfo {
					float:left;
					width:355px;
				}

					#productpage .prodinfo h2 {
						font-weight:600;
						color:#005DAB;
						line-height:1.25;
						font-size:240%;
					}

					#productpage .proddescription p {
						margin:1em 0;
					}

					#productpage .proddescription ul, #productpage .proddescription ol {
						list-style:disc;
						margin:1em 1em;
						padding:0 1em;
					}
					
					
					#productpage table.udltable {
						width:350px;
						font-size:95%;
					}
					
					#productpage table.udltable th, #productpage table.udltable td {
						padding:2px 6px;
						border:1px solid #ccc;
					}
					
					#productpage table.udltable th {
						text-align:left;
						font-weight:bold;
						background-color:#D6D5D5;
						color:#333;
					}
					
					#productpage table.udltable td.note {
						font-size:90%;
					}
					
					#productpage .price {
						font-size:240%;
						font-weight:bold;
						color:#ca0020;
					}
					
						#productpage .price span {
							font-size:50%;
							font-weight:normal;
							line-height:1;
							display:block;
							margin-bottom:0;
						}
				
					#productpage .freepost {
						float:right;
					}
			
					#productpage .price .taxmessage {
						font-size:40%;
						display:inline;
					}
					
					
					#purchasing {
						float:left;
						width:355px;
						margin:20px 0;
					}
					
					.prodpriceinfo {
						float:left;
						margin-right:40px;
					}
					
					.orderinginfo {
						float:right;
						width:140px;
					}
					
					.orderinginfo .formButton, .optionstable .formButton {
							display:block; 
							float:right;
						}
						
						.orderinginfo .available {
							font-weight:bold;
							color:#ca0020;
						}
					
					#productpage #quantity, #productpage .qty {
						border:1px solid #ca0020;
						text-align:center;
						width:2.5em;
						padding:1px;
					}
					
					
					#productpage .optionstable {
						width:695px;
						margin:1em 0 2em 0;
						border:1px solid #ccc;
					}
						
						.optionstable tr {
							
						}
					
						.optionstable th {
							background-color:#D6D5D5;
							font-weight:bold;
							padding:4px;
							text-align:left;
							border-bottom:1px solid #ccc;
						}
						
						.optionstable td {
							padding:4px;
							border-bottom:1px solid #ccc;
						}
						
						
						.optionstable td.purchase {
							width:140px;
						}
						
						.optionstable .col1, .optionstable .col2, .optionstable .col3 {
							text-align:center;
						}
						
						.optionstable .col1 {
							background-color:#EFF9FF;
						}
						
						.optionstable .col2 {
							background-color:#DFF1FF;
						}
						
						.optionstable .col3 {
							background-color:#CFE5FF;
						}
						
						.optionstable .qty {
							float:left;
						}
						
						.optionstable .formButton {
							float:right;
						}
						
						.optionstable label {
							float:left;
							margin-right:3px;
						}
			
			
			/* sort container */

			#productSort #productSortOptions {
				background: #f2f2f2;
				margin: 0 0 1em 0;
				padding: .5em 10px;
				}

			/* sort options */

			#productSort #productSortOptions .sortBlock {
				float: left;
				margin-right: 10px;
				width: 140px;
				}
			#productSort #productSortOptions .sortBlock .formSelect {
				width: 140px;
				}
			#productSort #productSortOptions .formButton {
				float: right;
				margin-top: 2.6em;
				}

			/* sort by attributes */

			#productSort h4 {
				margin: .8em 0 0 0;
				text-transform: none;
				}
			#productSort #productSortOptions dl,
			#productSort #productSortOptions dl dt,
			#productSort #productSortOptions dl dd {
				margin: 0;
				padding: 0;
				}
			#productSort #productSortOptions dl {
				margin: .5em 0;
				padding-left: 150px;
				position: relative;
				}
			#productSort #productSortOptions dl dt {
				clear: left;
				color: #555;
				float: left;
				font-weight: bold;
				margin-left: -150px;
				width: 140px;
				}
			#productSort #productSortOptions dl dd {
				color: #888;
				float: left;
				margin-right: 1em;
				}

			/* pagination */

			.pagination {
				background: #f2f2f2;
				clear: both;
				color: #777;
				font-weight: bold;
				margin: -2em 0 1em 0;
				padding: .5em 10px .5em 5px;
				}
			.pagination p {
				margin: 0;
				}
			.pagination p.current {
				display: inline;
				float: right;
				line-height: 1em;
				margin: .5em 0;
				}
			.pagination p.summary {
				border-left: 1px solid #bbb;
				float: right;
				line-height: 1em;
				margin: .5em 0 .5em .6em;
				padding-left: .5em;
				}
			.pagination a,
			.pagination a:link,
			.pagination a:visited,
			.pagination a:active {
				color: #666;
				display: block;
				float: left;
				font-weight: bold;
				margin-right: 2px;
				padding: .1em 6px;
				}
			.pagination a:hover {
				color: #111;
				}
			.pagination a.selected {
				background: #fff;
				color: #111;
				}
			.pagination.end {
				margin-top: 0;
				}
	
		
		
		
		/* Shopping basket/checkout table */
	
		#baskettable {
			float:left;
			background-color:#fff;
			border:1px solid #ddd;
			border-collapse:collapse;
			width:705px;
			margin:2em 0;
		}
		
			#baskettable th {
				padding:4px;
				font-weight:bold;
				font-size:110%;
				background-color:#005DAB;
				color:#fff;
				text-align:left;
			}
			
			#baskettable td {
				vertical-align:top;
				border-bottom:1px solid #ddd;
				padding:4px;
			}
			
			#baskettable td.image {
				text-align:center;
			}
			
			#baskettable td.totallabel {
				text-align:right;
				border-bottom:none;
				border-right:1px solid #ddd;
			}
			
			#baskettable td.totalnumber, #baskettable th.totalnumber {
				text-align:right;
			}
			
			#baskettable td.grandtotal {
				font-weight:bold;
				font-size:110%;
			}
	
			#baskettable td.removeItem, #baskettable th.remove {
				width:80px;
				text-align:right;
			}
			
			#baskettable .qty {
				border:1px solid #ca0020;
				text-align:center;
				width:2.5em;
				padding:1px;
			}
		
		
		
		/* View Cart */
		
			#ThisForm {
				margin-bottom:2em;
			}
			
		
			
		
			#acceptedCards {
				float:left;
			}
			
			#PostageForm {
				float:right;
				padding:12px;
				border:1px solid #ccc;
				background-color:#dedede;
			}
		
			.checkoutbutton {
				float:right;
			}
			
			.voldiscnote {
				font-weight:bold;
				color:#CA0020;
			}
			
			
			
		/* Checkout */
		
		
		table.user {
			margin:1em 0;
		}
		
		table.user td {
			padding:4px 0;
		}
		
		
		#customerReg {
			font-size:150%;
			padding:6px;
			border:1px solid #ccc;
		}
		
		
		#postage {
			float:left;
			width:325px;
			margin-right:25px;
		}
		
		#paymentmethod {
			float:left;
			width:325px;
		}
		
		
		#promotions {
			float:left;
			width:325px;
			margin-right:25px;
		}
		
		#comments {
			float:left;
			width:325px;
		}
		
		#placeorder {
	
		}
		
		.block {
			float:left;
			width:705px;
			padding-bottom:1em;
			margin-bottom:1em;
			border-bottom:1px solid #dedede;
		}
		
			
		/* My Account */
		
		#accountbuttons {
			
		}
		
			#accountbuttons li {
				display:inline;
				margin-right:10px;
			}
		
		
		#mydetails {
			border:1px solid #E1EAEF;
			background-color:#EFF9FF;
			padding:12px;
			margin:1em 0;
			width:681px;
			float:left;
		}	
		
		
			#addressinfo, #contactinfo {
				margin-bottom:1em;
				width:340px;
				float:left;
			}
			
			#editbutton {
				clear:both;
			}
			
			
		#orderhistory {
			margin-top:2em;
		}	
			
		#orderslist {
			float:left;
			background-color:#EFF9FF;
			border:1px solid #E1EAEF;
			border-collapse:collapse;
			width:705px;
			margin:1em 0;
		}

			#orderslist th {
				padding:4px;
				font-weight:bold;
				font-size:110%;
				background-color:#005DAB;
				color:#fff;
				text-align:left;
			}

			#orderslist td {
				vertical-align:top;
				border-bottom:1px solid #ddd;
				padding:4px;
			}
			
			#orderslist td.details {
				width:110px;
			}
			
			
		/* Invoice/Receipt screen */
		
		#invoicecompanydetails {
			clear:both;
			margin:1em 0;
			text-align:left;
		}
			
			
			#invoicetable {
				float:left;
				background-color:#fff;
				border-collapse:collapse;
				width:705px;
				margin:2em 0;
			}

				#invoicetable th {
					padding:4px;
					font-weight:bold;
					font-size:110%;
					background-color:#005DAB;
					color:#fff;
					text-align:left;
				}

				#invoicetable td {
					vertical-align:top;
					border-bottom:1px solid #ddd;
					border-left:1px solid #ddd;
					border-right:1px solid #ddd;
					padding:4px;
				}

				#invoicetable td.image {
					text-align:center;
				}

				#invoicetable td.totallabel {
					text-align:right;
					border:none!important;
				
					font-weight:bold;
				}

				#invoicetable td.totalnumber, #invoicetable th.totalnumber {
					text-align:right;
				}

				#invoicetable td.grandtotal {
					font-weight:bold;
					font-size:110%;
				}

				#invoicetable td.removeItem, #invoicetable th.remove {
					width:80px;
					text-align:right;
				}
				
				
				#orderdetails, #payshipdetails, #invoicecompanydetails {
					padding:12px;
					border-bottom:1px solid #ccc;
					float:left;
					width:681px;
				}
				
				
				#orderdetails h4, #orderdetails h4 {
					margin-top:1em
				}
				
			
				
				#orderstatus {
					
				}
				
				#ordercomments {
					
				}
				
				p.actions {
					text-align:right;
				}
			


	/* Search results */
	
	.searchresults div.block {
		margin:0 0 1em 0;
		padding-bottom:1em;
	}
	
	
		.searchresults h3 {
			margin-bottom:1em;
		}
		
		
		.searchresults li {
			padding:1em 0;
		}
		
		.searchresults li img {
			float:left;
			margin-right:24px;
		}
		
		.searchresults li.alt {
			background-color:#EFF8FF;
		}
	
	
	
	



		/* General (Global) Forms */
		
		.global-form fieldset {
			margin:0.5em 0;
			padding:0.5em 0;
		}
		
		.global-form legend {
			font-size:150%;
			color:#005DAB;
		}
		
		.global-form p {
			margin-bottom:0.5em;
			padding:0.5em 0;
		}
		
		.global-form label {
			display:block;
			/*float:left;
			width:150px;*/
			font-weight:bold;
			color:#005DAB;
		}
		
			.global-form label span {
				color:#ca0020;
			}
		
		.global-form input, .global-form select {
			width:300px;
		}
		
		.global-form input, .global-form textarea {
			border:1px solid #C3D5DF;
			padding:4px;
			-moz-border-radius:3px;
			-webkit-border-radius:3px;
			border-radius:3px;
			font-size:110%;
		}


		.global-form textarea {
			font:inherit;
			font-size:110%;
		}
		
		.global-form .formButton {
			width:auto !important;
			border:0;
			padding:0;
		
		}
		
		.global-form .formRadio {
			width:auto;
			border:0;
		}
		
		/* Special classes */
		
		
		.message {
			padding:8px;
			border:1px solid #EFECD1;
			background-color:#FFFCDF;
			margin:1em 0;
		}
		
		.clearer {
			visibility:hidden;
			clear:both;
		}
		
		div.useractivity {
			background:url(../graphics/essentiallystorage/redboxbg.png) top left repeat-x #ca0020;
			-moz-border-radius:6px;
			-webkit-border-radius:6px;
			border-radius:6px;
			padding:8px;
			margin-bottom:8px;
		}
		
		
		div.panel {
			float:left;
		}
		
	
	
		/* shopping cart & checkout */

		.module1 {
			float: left;
			margin: 1em 0;
			width: 340px;
			display: inline;
			}
		.module2 {
			float: right;
			margin: 1em 0;
			width: 340px;
			display: inline;
			}
		.module1 *:first-child,
		.module2 *:first-child {
			margin-top: 0;
			}
	
	
		#timer {
			visibility:hidden;
		}
		
		.alert {
			font-weight:bold;
			color:red;
			background-color:yellow;
		}
		
		.error {
			background-color:#fffcdf;
			border:1px solid red !important;
		}
		