/*------------- 
  General Rules
---------------*/
body {
	margin:         0;
	font-size:      15px;
	color:          #5192d4;
	font-family:    Arial,Helvetica,sans-serif;	
}

p {
	margin:         0;
}

h1 {
	margin:         0;
	color: 			#142557;}

h2,h3,h4,h5,h6 {
	margin:         0;
}

ul, ol {
	margin:         0;
	padding:        0;
	list-style:     none;
}

body a{
	text-decoration: none;
}
body a:hover,body a:active{
	text-decoration: none;
}
body a, body a:visited, body a:hover{
	color: 			#03091c;
}
body a img{
	border: 		none;
}


/*------------- 
  Main Elements
---------------*/


#headerWrap, #mainWrap, #footerWrap{
	text-align:    center;
}


#header, #main{
	width:          980px;
	margin:         0 auto;
	text-align:    	left;
}

#header{
	overflow:visible;
	position:relative;
	padding:  0 0 20px;
}
.logoWrap{
	position: relative;
}
.logoWrap img{
	z-index: 1;
	position:relative;
}


.headerLinks {
	float: right;
	font: normal 14px verdana,sans-serif;
	bottom : 38px;
	position: relative;
}

.headerLinks li {
	color: #072540;
	display: inline;
	padding : 0 2px;
}

.headerLinks a {color: #072540;}

/*------------ 
  Main Wrapper
--------------*/
body #mainWrap{
	background:   url("http://www.reed.co.uk/resources/cms/social/img/social-network-bg.png") repeat-x scroll 0 3% transparent;
} 



body #main{
	padding-bottom:70px;
	position: relative;
    z-index: 5;
}

body #main a:hover {text-decoration:none;} 

/*------- 
  Content
---------*/
/*
Rules
*/
/*imageBoard*/
.contentInner h3,
.contentInner h4 span,
.contentInner h4 a,
.contentInner h5,
.contentInner h6 a,
.contentInner b,
.contentInner h6 small,
.contentInner p a,
.redCircle,
.clock,
#clock{ background: url("http://www.reed.co.uk/resources/cms/social/img/imgBoard.png") no-repeat transparent;}

/*Layout*/
.contentInner h2,
.contentInner h3,
.contentInner h4,
.contentInner h5,
.contentInner h6,
#clock,
small.clock,
small.redCircle,
.contentInner p { position:absolute;}

/*Align Content*/
.contentInner b,
.contentInner a,
.contentInner small,
.contentInner span,
.contentInner strong { display: block;}


/*IE7 text-indent*/
.contentInner h2 b,
.contentInner p,
.contentInner h2 small {
    *text-indent:0; 
	*line-height:0; 
	*font-size:0; 
	*overflow:hidden;
}

.contentInner a:hover,
.contentInner a:focus { color:#0066cc;}

.contentWrap { background: url("http://www.reed.co.uk/resources/cms/social/img/social-network-lights.png") no-repeat 0 0.3%;}

/*
 contentInner
*/
.contentInner{
	background: url("http://www.reed.co.uk/resources/cms/social/img/shelf.png") no-repeat 0 72%;
    height: 928px;
    overflow: hidden;
    position: relative;
    top: -16px;
   *top: 0;
    width : 100%;
}

.contentInner h1{
	font: bold 29px Arial, sans-serif;
	letter-spacing: -0.05em;
	padding-top:40px;
}

.contentInner h1 em{
	color: #223e8f;
	font-style: normal;}

.contentInner h2{
	font:normal 17px/1.5em 'Coming Soon', arial, sans-serif;
	top: 251px;
	left:17px;
	width: 180px;
	text-align: center;
}

.contentInner h2 b{
	background-position: -13% 40%;
	height: 87px;
	text-indent: -999em;
}

.contentInner h2 a:hover b,
.contentInner h2 a:active b,
.contentInner h2 a:focus b{ background-position: -13% 49%;}

.contentInner h2 span{
	height: 185px;
	overflow: hidden;
	top: 54px;
	left: 15px;
    *left: -21px;
	width: 73px;
	position: relative;
}

.phoneWrapper{
	background: url("http://www.reed.co.uk/resources/cms/social/img/iPhone.png") no-repeat left top transparent;
	height: 185px;
	left: 65px;
    *left: 41px;
    position: relative;
    width: 145px;
}

.phoneFrame{
	height: 185px;
	overflow: hidden;
    position: relative;
    width: 115px;
}

.contentInner h2 small{
	background: url("http://www.reed.co.uk/resources/cms/social/img/slides.png") no-repeat left top transparent;
    height: 185px;
    left : 0px;
    position: relative;
    text-indent: -999em;
    width: 145px;
}

.contentInner h3{ 
	background-position: 81% 100%;
	height: 306px;
	left: 208px;
	top: 132px;
	text-indent: -999em;
	width : 255px;
}

.contentInner h3 a:active,
.contentInner h3 a:hover,
.contentInner h3 a:focus{ cursor:pointer;}

#board-link{
    height: 306px;
    width: 255px;
}

.board-wrapper{
    height: 175px;
    left: 60px;
    overflow: hidden;
    position: relative;
    top: 40px;
   *top: 44px;
    width: 126px;
}

.board-light{
	width: 126px;
	height: 174px;
	background: url("http://www.reed.co.uk/resources/cms/social/img/testLight.png") no-repeat 0 0;
	position:absolute;
	left: -100px;
}

.contentInner h4{
	font:normal 26px/1.1em 'Coming Soon', arial, sans-serif;
	height: 255px;
	left: 495px;
	top: 228px;
	width: 160px;
	z-index: 5;
}

.contentInner h4 a {
    background-position: 26% -15%;
    height: 197px;
    width: 140px;
}

.contentInner h4 a:active,
.contentInner h4 a:hover,
.contentInner h4 a:focus{ background-position: 26% 8%;}


.contentInner h4 a:active span,
.contentInner h4 a:hover span,
.contentInner h4 a:focus span{ background-position: -2% 0%;}

.contentInner h4 a:active b,
.contentInner h4 a:hover b,
.contentInner h4 a:focus b{ background-position: 23% 12%;}

.contentInner h4 span{
	background-position: -2% 21%;
	padding-top: 60px;}

.contentInner h4 em{
	font-weight: bold;
	font-size: 32px;
	font-style: normal;
}

.contentInner h4 small{
	background: url("http://www.reed.co.uk/resources/cms/social/img/boxsprite.png") 0 0 transparent;
	height: 117px;
	left: 23px;
	text-indent: -999em;
	top: -50px;
   *top: -47px;
	width: 142px;
	position: relative;
}

.contentInner h5{
	background-position: 0% 66.5%;
	height: 188px;
	left: 220px;
   	text-indent: -999em;
	top: 470px;
   	width : 459px;
	z-index: 1;
}

.contentInner h6{
	font: normal 36px/1.2em 'Loved by the King', verdana, sans-serif;
	height: 128px;
	left: 752px;
	text-align: center;
	text-transform: uppercase;
	top: 100px;
	width: 170px;
	word-spacing: -0.2em;
	z-index: 2;
}

.contentInner h6 strong{ font-weight: normal;}

.contentInner h6 a{
	background-position: 60% 8%;
	height: 100%;
	padding-top: 1px; /*Fix Firefox bg-position*/
	width: 180px;
}


.contentInner h6 a:active,
.contentInner h6 a:focus,
.contentInner h6 a:hover{ background-position: 60% -4%;}

.contentInner h6 small{
  background-position: 97% 2%;
  height: 335px;
  right: 92px;
 *right: 130px;
  text-indent: -999em;
  top: -205px;
  width: 83px;
  position: relative;
}

#clock{
   	background-position: 82.2% 40%;
    padding: 2px 0 0 27px;
    right: 36px;
    top: 254px;
    z-index: 1;
}

small.clock{
  background-position: 30% 39%;
  right: 38px;
  height: 220px;
  text-indent: -999em;
  top: 241px;
  width: 220px;
}

small.redCircle{
	background-position: 100% 65%;
	height: 200px;
	text-indent : -999em;
	top: 392px;
    left:670px;
    width: 199px;
    z-index:7;
}

.contentInner p{
	left: 450px;
    top: 577px;
    width:230px;
}

.contentInner p a{	
  background-position: 6% 95%;
  height:250px;
  text-indent:-999em;}

/*------ 
  Footer
--------*/


body #footer{
    position: relative;
    z-index: 1;
}

/*----
  CSS3 
------*/
/*
Text-shadow
*/
.contentInner h1 em { text-shadow: -1px -1px -1px #f2efef;}

/*
Text-rotation
*/
.contentInner h2 a,
.contentInner h4 span {
/* Safari */
-webkit-transform: rotate(-8deg);
/* Firefox */
-moz-transform: rotate(-8deg);
/* Opera */
-o-transform: rotate(-8deg);
}

.contentInner h6 strong{
 /* Safari */
-webkit-transform: rotate(4deg);
/* Firefox */
-moz-transform: rotate(4deg);
/* Opera */
-o-transform: rotate(4deg);
}