/* width and padding: 
IE: padding is added to width to give total width
FF: width is respected and padding is inside this

   width and margin:
IE: margin is outside of width
FF: margin is outside of width

The result of the above is that you should put the width and margin on the parent container
and just padding on the child.  HOWEVER the problem still semms to occur if paddingleft/right
is set on a div within a parent div - the padding left/right must be set on an element.
*/

/*
  home page

  - content panels should be height=425 in total including bottom images
  - note replace css in image_replacements.css; position: relative; top: 0px; left: 0px;

*/

div{
        margin:0px;
        padding:0px;
}

div p, ol, ul{
        padding: 0 7px;
}

#flash{
	margin:0 0 5px 0;
}

/* * html is only recognised by IE */
/* this is here because I can't fix IE/FF diff: margin above footer */
* html #content{
        margin-bottom:-5px;
}

#content{
	background:none;
	margin:0 0 10px 0;
}

#content_steps_box{
	background:url(../images/bg_content_steps_home.gif) no-repeat;
	float:left;
	position:relative;
	margin-right:5px;
	width:225px;
	height:345px;
}

#content_steps{
/* note: specifying left and right padding here 
         would add to total width - don't really understand that */
	padding:55px 0px 0px 0px;
}

#content_steps_bottom{
	background:url(../images/bg_content_steps_home_bottom.jpg) no-repeat;
	width:225px;
	height:125px;
        position:absolute;
        top:300px;
        left:0px;
}

#content_membership_box{
	background:url(../images/bg_content_membership_home.gif) no-repeat; /* 314x400 */
	float:left;
	position:relative;
	margin-right:5px;
	width:315px;  
	height:420px;
}

#content_membership{
/* note: specifying left and right padding here 
         would add to total width - don't really understand that */
	padding:42px 0px 0px 0px;
}

#content_membership_bottom{
	background:url(../images/bg_content_membership_home_bottom.gif) no-repeat; /* 314x5 */
	width:315px;
	height:5px;
	position:absolute;
	top:420px;
	left:0px;
}

#content_news_box{
	background:url(../images/bg_content_news_home.gif) no-repeat;
	float:left;
	position:relative;
	width:210px;
        height:350px;
}

#content_news{
	padding:45px 0px 0px 0px;
        width:210px;
}

#content_news_wrapper{
        overflow:auto;
	padding:0px 0px 0px 0px;
        width:208px;
        height:270px;
}

#content_news_items{
	padding:0px 5px 0px 5px;
}

#content_news_bottom{
	background: url(../images/bg_content_news_home_bottom.jpg) no-repeat;
	width:210px;
	height:97px;
	position:absolute;
	top:328px;
	left:0px;
}

ol li{
	margin:0 0 15px 0px;
	list-style:none;
}

ul li{
	margin:0 0 5px 15px;
/*	list-style:none; */
}

#h2_for_less_than_one_pound{
	width:239px;
	height:40px;
        left:5px;
}

#h2_save_money{
	width:264px;
	height:22px;
        left:5px;
}

#link_find_out_more, #link_find_out_more span{
	background: url(../images/link_find_out_more.gif) no-repeat;
        float:right;
	width:111px;
	height:17px;
}

#link_see_how_it_works, #link_see_how_it_works span{
	background: url(../images/link_see_how_it_works.gif) no-repeat;
        float:right;
	width:136px;
	height:14px;
}

#link_sign_up_here, #link_sign_up_here span{
	background: url(../images/link_sign_up_here.gif) no-repeat;
        float:right;
	width:103px;
	height:17px;
}