﻿/*
*
*	centenary.css
*	- Main layout for SM Centenary
*
*/

@import "modules.css";
@import "typography.css";
@import "slides.css";
/*@import "debug.css";*/

/*	Global
----------------------------------------------------------------------------*/

*{
	margin: 0;
	padding: 0;
}
.clear:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

/*	Main layout	
----------------------------------------------------------------------------*/

div#header div#header-image{
	background: none;
}
div#content{
	background-color: #fff;
	background-repeat: no-repeat;
	float: left;
	padding: 12px 12px 0 12px;
	position: relative;
	width: 720px;
}
div#primary{
	float: right;
	width: 535px;
}
div#primary-content{	
	clear: left;
	float: left;
	margin: 15px 0 0 0;
	min-height: 400px;
	width: 535px;
}
div#secondary{
	float: left;
	padding: 0;
	margin-top: 240px;
	width: 160px;
}
div#secondary #bookmarks{
	bottom: 5px;
	left: 25px;
	position: absolute;
	width: 125px;
}

div#primary-heading{
	border-bottom: 1px solid #00A0AF;
	float: left;
	padding-top: 120px;
	position: relative;
	width: 535px;
}
#memories div#primary-heading{
	border-color: #B3C035;
}
#memories div#primary-content{
	margin-top: 0;
	padding-bottom: 15px;
}
#memories div#primary-content.thanks{
	margin-top: 15px;
}
#centenary-icons div#primary-content.thanks{
	min-height: 720px;
}
#memories div#primary-content.thanks{
	min-height: 470px;
}
/* 	
	These are the various 'header backgrounds, and 
	can be swapped out by changing the class name.
	The top half is applied to #container, the bottom 
	half applied to #content
*/

div#container{	
	background-position: 0 26px;
	background-repeat: no-repeat;
}

#home div#header div#header-image					{	background-image: url('/images/centenary/headers/hdr-home-top.png')		}
#home div#container.header-one #content				{	background-image: url('/images/centenary/headers/hdr-home-bottom.png')	}

#centenary-icons div#header div#header-image		{	background-image: url('/images/centenary/hdr-centenary-icons-top.png')		}
#centenary-icons div#container.header-one #content	{	background-image: url('/images/centenary/hdr-centenary-icons-bottom.png')	}

#memories div#header div#header-image				{	background-image: url('/images/centenary/headers/hdr-memories-top.png')		}
#memories div#container.header-one #content			{	background-image: url('/images/centenary/headers/hdr-memories-bottom.png')	}

#appeal div#header div#header-image					{	background-image: url('/images/centenary/headers/hdr-appeal-top.png')		}
#appeal div#container.header-one #content			{	background-image: url('/images/centenary/headers/hdr-appeal-bottom.png')	}

#whatson div#header div#header-image					{	background-image: url('/images/centenary/headers/hdr-whatson-top.png')		}
#whatson div#container.header-one #content			{	background-image: url('/images/centenary/headers/hdr-whatson-bottom.png')	}

#about div#header div#header-image					{	background-image: url('/images/centenary/headers/hdr-about-top.png')		}
#about div#container.header-one #content			{	background-image: url('/images/centenary/headers/hdr-about-bottom.png')		}

#future div#header div#header-image					{	background-image: url('/images/centenary/headers/hdr-future-top.png')		}
#future div#container.header-one #content			{	background-image: url('/images/centenary/headers/hdr-future-bottom.png')		}

#shop div#header div#header-image					{	background-image: url('/images/centenary/headers/hdr-shop-top.png')		}
#shop div#container.header-one #content			{	background-image: url('/images/centenary/headers/hdr-about-shop.png')		}


