/*****************************************************************
** COPYRIGHT. HSBC HOLDINGS PLC. ALL RIGHTS RESERVED.
** THIS SOFTWARE IS ONLY TO BE USED FOR THE PURPOSE FOR WHICH IT
** HAS BEEN PROVIDED. NO PART OF IT IS TO BE REPRODUCED,
** DISASSEMBLED, TRANSMITTED, STORED IN A RETRIEVAL SYSTEM NOR
** TRANSLATED IN ANY HUMAN OR COMPUTER LANGUAGE IN ANY WAY OR
** FOR ANY OTHER PURPOSES WHATSOEVER WITHOUT THE PRIOR WRITTEN
** CONSENT OF HSBC HOLDINGS PLC.
*******************************************************************/

/* File is used to handle the grid structure as per DCE guidelines */

body {
	margin: 0
}

.clearfix {
	*zoom: 1
}

.clearfix:before, .clearfix:after {
	content: "";
	display: table
}

.clearfix:after {
	clear: both
}

.mainwrapper .clearboth {
	clear: both
}

.mainwrapper .pull_right {
	float: right
}

.mainwrapper .pull_left {
	float: left
}

.mainwrapper .clearfloat {
	float: none
}

.mainwrapper .zeromarg {
	margin: 0
}

.mainwrapper .zeromarg-top {
	margin-top: 0
}

.mainwrapper .zeromarg-bottom {
	margin-bottom: 0
}

.mainwrapper {
	max-width: 90em;
	padding: 0 1.429em;
	margin: 0 auto
}

.footer-bottom .mainwrapper {
	max-width: 100em;
	padding-left: 1.429em;
	padding-right: 1.429em
}

.row {
	margin-right: -10px;
	margin-left: -10px;
	*zoom: 1
}

.row:before, .row:after {
	content: "";
	display: table
}

.row:after {
	clear: both
}

.column, .columns {
	float: left;
	min-height: 1px;
	padding: 0 10px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box
}

.column.nopad, .columns.nopad {
	padding: 0
}

.column.nopadleft, .columns.nopadleft {
	padding-left: 0
}

.column.nopadright, .columns.nopadright {
	padding-right: 0
}

img, object, embed {
	max-width: 100%;
	height: auto
}

img {
	-ms-interpolation-mode: bicubic
}

@media only screen and (min-width: 960px) {
	.row {
		margin-right: -10px;
		margin-left: -10px
	}
	
	.row .l-one.column {
		width: 8.3333333333333%
	}
	.row .l-one.columns {
		width: 8.3333333333333%
	}
	.row .l-two.columns {
		width: 16.666666666667%
	}
	.row .l-three.columns {
		width: 25%
	}
	.row .l-four.columns {
		width: 33.333333333333%
	}
	.row .l-five.columns {
		width: 41.666666666667%
	}
	.row .l-six.columns {
		width: 50%
	}
	.row .l-seven.columns {
		width: 58.333333333333%
	}
	.row .l-eight.columns {
		width: 66.666666666667%
	}
	.row .l-nine.columns {
		width: 75%
	}
	.row .l-ten.columns {
		width: 83.333333333333%
	}
	.row .l-eleven.columns {
		width: 91.666666666667%
	}
	.row .l-twelve.columns {
		width: 100%
	}
	.showonmobile {
		display: none
	}
	.hideonmobile {
		display: block
	}
	.showontablet {
		display: none
	}
	.hideontablet {
		display: block
	}
	.showondesktop {
		display: block
	}
	.hideondesktop {
		display: none
	}
	.removedesktopleftpad {
		padding-left: 0
	}
	.removedesktoprightpad {
		padding-right: 0
	}
}

@media only screen and (min-width: 640px) and (max-width: 959px) {
	.mainwrapper {
		padding: 0 1.286em
	}
	.row {
		margin-right: -8px;
		margin-left: -8px
	}
	.column, .columns {
		padding: 0 9px
	}
	.row .m-one.column {
		width: 8.3333333333333%
	}
	.row .m-one.columns {
		width: 8.3333333333333%
	}
	.row .m-two.columns {
		width: 16.666666666667%
	}
	.row .m-three.columns {
		width: 25%
	}
	.row .m-four.columns {
		width: 33.333333333333%
	}
	.row .m-five.columns {
		width: 41.666666666667%
	}
	.row .m-six.columns {
		width: 50%
	}
	.row .m-seven.columns {
		width: 58.333333333333%
	}
	.row .m-eight.columns {
		width: 66.666666666667%
	}
	.row .m-nine.columns {
		width: 75%
	}
	.row .m-ten.columns {
		width: 83.333333333333%
	}
	.row .m-eleven.columns {
		width: 91.666666666667%
	}
	.row .m-twelve.columns {
		width: 100%
	}
	.showonmobile {
		display: none
	}
	.hideonmobile {
		display: block
	}
	.hideonmobileInline {
		display: inline
	}
	.showontablet {
		display: block
	}
	.hideontablet {
		display: none
	}
	.showondesktop {
		display: none
	}
	.hideondesktop {
		display: block
	}
	.removetabletleftpad {
		padding-left: 0
	}
	.removetabletrightpad {
		padding-right: 0
	}
}

@media only screen and (min-width: 0) and (max-width: 639px) {
	.mainwrapper {
		padding: 0 1.143em
	}
	.row {
		margin-right: -6px;
		margin-left: -6px
	}
	.column, .columns {
		padding: 0 7px
	}
	.row .s-one.column {
		width: 8.3333333333333%
	}
	.row .s-one.columns {
		width: 8.3333333333333%
	}
	.row .s-two.columns {
		width: 16.666666666667%
	}
	.row .s-three.columns {
		width: 25%
	}
	.row .s-four.columns {
		width: 33.333333333333%
	}
	.row .s-five.columns {
		width: 41.666666666667%
	}
	.row .s-six.columns {
		width: 50%
	}
	.row .s-seven.columns {
		width: 58.333333333333%
	}
	.row .s-eight.columns {
		width: 66.666666666667%
	}
	.row .s-nine.columns {
		width: 75%
	}
	.row .s-ten.columns {
		width: 83.333333333333%
	}
	.row .s-eleven.columns {
		width: 91.666666666667%
	}
	.row .s-twelve.columns {
		width: 100%
	}
	.showonmobile {
		display: block
	}
	.hideonmobile {
		display: none
	}
	.hideonmobileInline {
		display: none
	}
	.showontablet {
		display: none
	}
	.hideontablet {
		display: block
	}
	.showondesktop {
		display: none
	}
	.hideondesktop {
		display: block
	}
	.removemobileleftpad {
		padding-left: 0
	}
	.removemobilerightpad {
		padding-right: 0
	}
}

@media print {
	.row {
		margin-right: -10px;
		margin-left: -10px
	}
	.row .l-one.column {
		width: 8.3333333333333%
	}
	.row .l-one.columns {
		width: 8.3333333333333%
	}
	.row .l-two.columns {
		width: 16.666666666667%
	}
	.row .l-three.columns {
		width: 25%
	}
	.row .l-four.columns {
		width: 33.333333333333%
	}
	.row .l-five.columns {
		width: 41.666666666667%
	}
	.row .l-six.columns {
		width: 50%
	}
	.row .l-seven.columns {
		width: 58.333333333333%
	}
	.row .l-eight.columns {
		width: 66.666666666667%
	}
	.row .l-nine.columns {
		width: 75%
	}
	.row .l-ten.columns {
		width: 83.333333333333%
	}
	.row .l-eleven.columns {
		width: 91.666666666667%
	}
	.row .l-twelve.columns {
		width: 100%
	}
	.showonmobile {
		display: none
	}
	.showontablet {
		display: none
	}
	.showondesktop {
		display: block
	}
	.hideondesktop {
		display: none
	}
}