/* --- Top banner --- */
.topBanner {
  line-height: 0;
  margin-bottom: 8px;
}

/* --- Hero block --- */
.homeHero {
	margin: 0 0 15px;
	position: relative; 
	width:1000px;	
	text-align:center;
	overflow:hidden;	
	}

	.homeHero a.hero {
		display:block;
		width:100%; 				
		color:#000;
		overflow:hidden;
		background:url(http://www.boden.co.uk/images/dummy.png;wa1a636b8d8bae5ad3);
		cursor:pointer;
	}
	.homeHero a.hero:hover {color:#000; text-decoration:none;}
	
	.homeHero  img.heroImg  {width: 100%;}
	
	.homeHero .copyBlock {position: absolute; right: 0; top:50px; overflow:hidden; }
	.homeHero .copyBlock a:hover {text-decoration:none; color:inherit;}
	
	.homeHero .copyBlock h1 {
		font:57px/60px BrandonGrotesque-Medium; 
		font-weight:normal; 
		text-transform:uppercase;
		display:block;
		text-align:left;
		width:350px;
		}
	
	.homeHero .copyBlock span.cta {
		font:22px/24px BrandonGrotesque-Regular;
		letter-spacing:0.1em;
		margin-top:20px;
		margin-right:20px; 
		float:right;
		display:inline-block; 
		padding:10px 15px; 
		border:1px solid #000; 
		text-transform:uppercase; 
		background:none;
		transition-property: background-color, color, border-color;
		transition-duration: 1s;
		}
	

/* --- Selling Proposition Message --- */
.titleDivider {text-align:center; border-bottom:1px solid #ccc; margin: 0 0 30px 0;}

.titleDivider h2 {
	display:inline-block; 
	font-weight:normal;
	font:17px/17px BrandonGrotesque-Regular;
	text-transform:uppercase; 
	letter-spacing:0.1em;
	position:relative; 
	top:9px; 
	padding:0 12px; 
	background:#fff;
	}
	
	.titleDivider h2 span {font:17px/17px BrandonGrotesque-Bold;}

/* --- Main Promos --- */
.mainPromos,
.xxlPomos,
.smallPromos {
	display:block; 
	clear:both; 
	overflow:hidden; 
	width:1000px; 
	margin:0 0 20px; 
	}
	
	.mainPromos li {margin:0 0 0 11px; float: left;}
	.mainPromos li:first-child,
	.xxlPromos li:first-child	{margin-left: 0;}	
	
	.mainPromos li a,
	.xxlPromos li a,
	.smallPromos li a {
		display: block;
		position:relative; 
		width:324px; 
		height:388px; 		
		margin:0;		
		text-align:center; 
		border:1px solid #eee;
		overflow:hidden;
		color: #000; 
		font: 17px/21px BrandonGrotesque-Medium;
		}
	
	.mainPromos li img {width: 324px; height: 324px;}
	
	.mainPromos li div.ctaArea,
	.xxlPromos li div.ctaArea {
		position:absolute; 
		background:#fff; 
		width:324px; 
		height:64px; 
		margin:auto; 
		bottom:0; 
		left:0; 
		z-index: 1;
	}
	
	.mainPromos li div.ctaArea p.title,
	.xxlPromos li div.ctaArea p.title {
		text-transform: uppercase; 
		padding-top: 10px; 
		letter-spacing:0.1em;
	}
	
	.mainPromos li div.ctaArea p.cta,
	.xxlPromos li div.ctaArea p.cta {display:inline-block; font-family: BrandonGrotesque-Regular;}

/* --- Department Pages --- */	

.mainListPadding {padding: 0 0 0 10px; width: 840px;}

.departmentWrapper .mainPromos,
.departmentWrapper .homeHero {width: 840px;}	

.departmentWrapper .mainPromos li {margin:0 0 20px 10px; float: left;}

.departmentWrapper .mainPromos li:first-child {margin-left: 0;}

.departmentWrapper .mainPromos li a {width: 271px; height: 336px;} 

.departmentWrapper .mainPromos li img {width: 271px; height: 271px;}

.departmentWrapper .mainPromos li div.ctaArea {width: 271px;}

.homeHero ul.babyNav {
		position: absolute;
		top: 273px;
		right: 125px;
		font: 13px/13px BrandonGrotesque-Medium;
		width: 194px;
		text-transform: uppercase;
		letter-spacing: 2px;
	}
	
		.homeHero ul.babyNav li a {
			float:left;
			margin-bottom:8px;
			color:#000;
			padding:10px;
			border:solid 1px #000;
			width:172px;
		}
		
			.homeHero ul.babyNav li a:hover {
				color:#cb4212;
				text-decoration:none;
				border:solid 1px #cb4212;
			}

/* --- New Home Page --- */
.promoBlks {overflow: hidden;}

.promoBlks.homeHero {margin: 0 0 10px;}

.xxlPromos {margin: 0 0 10px;}
.xxlPromos li {margin:0 0 0 10px; float: left;}
.xxlPromos li a {height: 498px; width: 493px; }
.xxlPromos li img {width: 493px; height: 498px;}

.promoBlks.mainPromos {margin: 0 0 10px;}
.promoBlks.mainPromos li {margin: 0 0 0 10px;}
.promoBlks.mainPromos li:first-child {margin-left: 0;}
.promoBlks.mainPromos li a{height: 324px;}


.smallPromos {background: #eee; margin: 0 0 10px;}
.smallPromos li {margin:20px 0 20px 20px; float: left;}
.smallPromos li a,
.smallPromos li img {border: none; height: 228px; width: 176px;}