/**
 * Layout
 *
 * Customized page layout styling. philippines
 *
 */

/* ----------------------------------------------------------------------------
	WIDE / 1 COLUMN LAYOUT

	Please refer to the documentation "SunlifeTemplateLayout.pdf" in the
	root folder of this package for more information.
---------------------------------------------------------------------------- */

/*
This layout gives you the full width of the body with the ability to add in
any number of rows consisting of three columns each.
*/
.stock {
	position: absolute;
	left: 825px;
	top:2px;
	font-size: 10px;
	width: 130px;
	height: 30px;
	color: #fff;
	text-align: right;
	background: transparent url(/static/global/images/navigation/primary/item_divder_vertical_bg.gif) no-repeat left bottom;

	}
	.stock .yellow {
		color:#f0c44b;
		}
.sitemap-list {
	font-size: 12px;
}
	.sitemap-indent {
		margin-left: 15px;
	}
	.sitemap-indent2 {
		margin-left: 30px;
	}
	.sitemap-indent3 {
		margin-left: 45px;
	}
sup {
	font-size: 0.8em;
	}
.footerStyle {
	font-size:0.8em;
}


/* START: FOR Philippines Home Page LayOut Only */


div.one-column-layout #content-body {
	float: none;
	margin: 0;
	width: 100%;
	
}


div.one-column-layout #content-body div.col-top {
	display:inline;
	float:left;
	width:969px;
}


div.one-column-layout #content-body div.col-top-left {
	display:inline;
	float:left;
	width:641px;
}


div.one-column-layout #content-body div.col-top-right {
	display:inline;
	float:left;
	margin-left:15px;
	width:313px;
}



div.one-column-layout #content-body div.col-bottom-left {
	display:inline;
	float:left;
	margin-top:20px;
	width:641px;
}


div.one-column-layout #content-body div.col-bottom-right {
	display:inline;
	float:left;
	margin-left:15px;
	margin-top:20px;
	width:313px;
}

/* END: FOR Philippines Home Page LayOut Only */

div.one-column-layout #content-body #middle-three {
	height: 87px;
	margin-bottom: 23px;
	position: relative;	
	
}

	div.one-column-layout #content-body div.col-left {
		display: inline;
		margin-top:10px;
		float: left;
		width: 313px;				
	}

	div.one-column-layout #content-body div.col-inner-left {
		display: inline;
		float: left;
		width: 100px;	
		height: 73px;	
		background: #00395a;
		font-size: 16px;
		line-height: 22px;
		font-weight: bold;
		padding-top: 14px;
		padding-left: 10px;		
	}
	div.col-middle-2 div.inner-left {
		width: 145px;
		display: inline;
		float: left;
		background: transparent;
	}
	div.col-middle-2 div.list {
		width: 180px;
	}
	div.col-middle-2 div.inner-right {
		width: 336px;
		display: inline;
		float: left;
		background: transparent;
		margin-left: 15px;
	}
	div.col-middle-2 div.others div.inner-right {
		
		margin-left: 8px;
	}
	div.col-middle-2 div.inner-right h2 {
		background: transparent;
		color: #00395a;
		font-size: 18px;
		line-height: 22px;
		border-bottom: None;
		padding-left: 0;
		padding-top: 0;
		

	}

	div.one-column-layout #content-body div.col-inner-left p {
		color: #ffffff;
		margin-bottom: 0;
	}

	div.one-column-layout #content-body div.col-inner-right {
		display: inline;
		float: left;
		width: 165px;
		height: 73px;		
		background: #80add5;
		padding-top: 14px;
		padding-left: 19px;
		padding-right: 19px;
		
	}
	div.one-column-layout #content-body div.col-inner-right p {
		font-size: 11px;
		line-height: 15px;
	}

	div.one-column-layout #content-body div.col-inner-right a {
		color: #ffffff;
		text-decoration: underline;
		display: block;
	}

	div.one-column-layout #content-body div.col-right div.col-inner-left {
		background: #eaab00;
	}

	div.one-column-layout #content-body div.col-right div.col-inner-right {
		background: #fbefcd;
	}

	div.one-column-layout #content-body div.col-right div.col-inner-right a {
		color: #eaab00;
	}

	div.one-column-layout #content-body div.col-left-2 {
		display: inline;
		float: left;
		width: 641px;		
	}

	div.one-column-layout #content-body div.col-middle {
		display: inline;
		float: left;
		margin-left: 15px;
		margin-top:10px;
		width: 313px;
	}

	div.one-column-layout #content-body div.col-right {
		display: inline;
		float: right;
		margin-left: 15px;
		margin-top:10px;
		width: 313px;
	}

	/*
	Ensure that the unsupported columms for this template layout are removed.
	*/
	div.one-column-layout #content-navigation,
	div.one-column-layout #content-sidebar {
		display: none;
	}

	/*
	For normal content that exists within this layout type, ensure that it is
	all placed within the <div> below.
	*/
	div.one-column-layout #content-body div.boxlayout {
		margin: 15px 19px 0 19px;
		width: auto;
	}



/* ----------------------------------------------------------------------------
	3 COLUMN LAYOUT

	Please refer to the documentation "SunlifeTemplateLayout.pdf" in the
	root folder of this package for more information.
---------------------------------------------------------------------------- */

/*
Defines three columns - navigation, content column one and content column two.
Content column one is approximately twice the width (540 pixels of content
column two (263 pixels). Within the first content column there is the option of
defining two more columns - each 263 pixels in width.
*/
div.three-column-layout #content-body {
	display: inline;
	float: left;
	margin: 16px 0 0 151px;
	width: 540px;
}


div#forms-content #content-body {
	display: inline;
	float: left;
	margin: 16px 0 0 0px;
	width: 580px;
}





	div.three-column-layout #content-body div.col-left-ph {
		display: inline;
		float: left;
		width: 240px;
		margin-left: 10px;
	}

	div.three-column-layout #content-body div.col-right {
		display: inline;
		float: left;
		margin-left: 14px;
		width: 263px;
	}

div.three-column-layout #content-sidebar {
	display: inline;
	float: left;
	margin: 7px 0 0 15px;
	overflow: hidden;
	width: 263px;
}

div.three-column-layout #content-navigation {
	display: inline;
	float: left;
	margin: 4px 0 0 -969px;
	width: 137px;
}


	div.three-column-layout #content-body div.col-middle-2 div.control-image-product {
		margin-bottom: 21px;
		width: 540px;
		height: 150px;
		background: url(/static/philippines/images/products_icon.gif) no-repeat 340px 0px;
	}

	div.three-column-layout #content-body div.col-middle-2 div.box {
		padding: 0 0 1px;
	}

	div.three-column-layout #content-body div.col-middle-2 div.box div.clearfix {
		
		padding-bottom: 14px;
		padding-top: 10px;
		padding-left: 19px;
	}

	div.three-column-layout #content-body div.col-middle-2 div.box div.dot {
		background: transparent url(/static/slfglobal/images/bread_dot_grad_bg.gif) repeat-x scroll left bottom;
		
	}

	div.two-column-layout #content-body div.col-middle-2 div.box div.dot {
		background: transparent url(/static/slfglobal/images/bread_dot_grad_bg.gif) repeat-x scroll left bottom;
		
	}

	div.three-column-layout #content-body div.col-middle-2 {
		display:inline;
		float:left;
		margin-top:8px;
		padding-right:0;
		width:530px;
	}
	



/* ----------------------------------------------------------------------------
	2 COLUMN LAYOUT

	Please refer to the documentation "SunlifeTemplateLayout.pdf" in the
	root folder of this package for more information.
---------------------------------------------------------------------------- */

/*
This layout is identical to the one beloe (second level) with the exception
of an increased gutter space between the navigation and body columns. One other
difference is the introduction of a right-hand floating sidebar. The content
will flow around this item.
*/
div.two-column-layout #content-body {
	display: inline;
	float: left;
	margin: 3px 0 0 151px;
	width: 818px;
}
	div.two-column-layout #content-body #content-sidebar {
		display: inline;
		float: right;
		margin: 0 0 14px 14px;
		width: 263px;
	}

	div.two-column-layout #content-body div.col-left {
		display: inline;
		float: left;
		width: 240px;
		margin-left: 10px;
	}

	div.two-column-layout #content-body div.col-middle {
		display: inline;
		float: left;
		margin-right: 17px;
		width: 263px;
	}
	div.two-column-layout #content-body div.col-middle-plans {
		display: inline;
		float: left;
		margin-right: 17px;
		width: 440px;
	}
	div.two-column-layout #content-body div.col-middle-plans h2{
		width: 440px;
	}
	div.two-column-layout #content-body div.col-middle-2 {
		display: inline;
		float: left;		
		width: 530px;
		margin-top: 8px;
		padding-right: 0px;

	}
	div.two-column-layout #content-body div.col-middle-2 div.others {
		margin-right: 10px;
	}
	div.two-column-layout #content-body div.col-middle-2 div.control-image {
		margin-bottom: 21px;
		width: 540px;
		height: 230px;
		background: url(/static/philippines/images/products_services.jpg) no-repeat;

	}
	div.two-column-layout #content-body div.col-middle-2 div.control-image h1 {
		margin-bottom: 0;
	}
	div.two-column-layout #content-body div.col-middle-2 div.control-image div {
		width: 310px;
	}
		div.two-column-layout #content-body div.col-middle-2 div.control-image-product {
		margin-bottom: 21px;
		width: 540px;
		height: 200px;
		background: url(/static/philippines/images/products_icon.gif) no-repeat 340px 50px;
	}
		div.one-column-layout #content-body inner-one-column-layout div.control-image-csr {
		margin-bottom: 21px;
		width: 540px;
		height: 190px;
		background: url(/static/images/content/CSR_indonesia.gif) no-repeat 360px 40px ;
	}


	div.two-column-layout #content-body div.col-middle-2 div.box {
		padding: 0 0 1px;
	}
	div.two-column-layout #content-body div.col-middle-2 div.recover-box {
		padding:11px 19px 1px;
	}
	div.two-column-layout #content-body div.col-middle-2 div.box div.clearfix {
		
		padding-bottom: 14px;
		padding-top: 10px;
		padding-left: 19px;
	}
	div.two-column-layout #content-body div.col-middle-2 div.box div.dot {
		background: transparent url(/static/slfglobal/images/bread_dot_grad_bg.gif) repeat-x scroll left bottom;
		
	}

	div.two-column-layout #content-body div.col-right {
		display: inline;
		float: left;
		margin-left: 14px;
		width: 263px;
	}


div.two-column-layout #content-navigation {
	display: inline;
	float: left;
	margin: 4px 0 0 -974px;
	width: 137px;
}






/* ----------------------------------------------------------------------------
	COUNTRY NAME OF THE WEB SITE
---------------------------------------------------------------------------- */

/*
Displays "Philippines" in the header region.
*/
#current-country {
	display: block;
	height: 23px;
	position: absolute;
	right: 315px;
	top: 17px;
}
	.en #header #current-country {
		background-image: url(/static/philippines/images/philippines_en.gif);
		width: 90px;
	}










/* ----------------------------------------------------------------------------
	CORE FUNCTIONS: NAVIGATION SKIPPER, PRINT-FRIENDLY LINKS, IMAGE LAYOUT,
	GRAPHICAL HEADERS, FLOATED ELEMENTS LAYOUT FIXER (CLEARFIX)
---------------------------------------------------------------------------- */

/*
Skip over navigation
*/
#skipper { display: none; }

/*
Print-friendly links
*/
.pf { display: none; }

/*
Center-align text element.
*/
.tcenter {
	text-align: center;
}

/*
Right-align text element.
*/
.tright {
	text-align: right;
}

/*
Float images on the left or right-hand
side of the content area.
*/
img.left {
	display: inline;
	float: left;
	margin: 2px 26px 14px 0;
}
img.right {
	display: inline;
	float: right;
	margin: 2px 0 5px 11px;
}

/*
Graphical headers
*/
#header h1,
#header #current-country,
#resize li a,
.hdr-graphic {
	background-color: transparent;
	background-position: left top;
	background-repeat: no-repeat;
	display: block;
	overflow: hidden;
	text-decoration: none;
	text-indent: -5000px;
}

/*
Clear floats so content beneath will flow
normally. This class must be attached to any
parent that has a floated child.
*/
.clearfix:after,
div.feature ul.columns:after,
div.inputRow:after {
	content: ".";
    display: block;
    height: 0;
    clear: both;
    line-height: 0;
    visibility: hidden;
}
.clearfix,
div.feature ul.columns,
div.inputRow {
	display: inline-block;
}
div.more-padding {
	margin-top: 8px;
	margin-bottom: 4px;
	padding-right: 30px;
}

div.two-column-layout #content-body div.more-padding div.col-middle{
	width: 225px;
	margin-left: 20px;
}
div.more-padding ul li {
	padding-bottom: 10px;
	padding-right: 16px;
	
}

/* Hide from IE Mac \*/
.clearfix,
div.feature ul.columns,
div.inputRow {
	display: block;
}


/* End hide from IE Mac */


/*----------------------------------------------------------------------------------------------------------
	This is responsible for Drop-down menu alignment and space bewteen drop-down menu and title bar.
------------------------------------------------------------------------------------------------------------*/

div.three-column-layout #content-body div.alignment-menu{
	display:inline;
	float:left;
	margin-right:17px;
	width:440px;
}
div.three-column-layout #content-body #space-drop-down-menu{
	padding:11px 19px 1px;
}
div.three-column-layout #content-body div.col-middle-plans h2 {
	width:440px;
}
div.three-column-layout #content-body div.clearfix h2 {
	width:440px;
}
div.three-column-layout div.clearfix div.box p {
	margin-bottom:2px;
}


/*----------------------------------------------------------
PHILIPPINES PLAIN FORM
----------------------------------------------------------*/

font.newsHeadlineSmall{
        font-family:'times new roman';
        font-size:12pt;
        font-style:normal;
        font-weight:400;
        font-color:red;
    }