/*
    Commonwealth Bank Group Campaign Template Version 2
    ===================================================
    Define: All structural/layout styles for the campaign template in MOBILE
    Born:   09/08/11
**/
    
	body {
	    /* stop text from resizing on phone rotation */
	    -webkit-text-size-adjust:none;
	}
	
	* { float: none !important; }
	
	/* Mobile or web specific */
	.mobileOnly { display:block !important; }
	.webOnly { display:none !important; }
	
	.contentCol,
    .contentColPrimary {
        padding: 0 !important;
    }
	
	/* 
	    Overwrite campaignMasthead Style 
    **/
	#headerContain { width: 100%; margin: 0; padding: 0; z-index: 0; text-align: center; }
	#logoContainer { margin: 0 auto; padding:0; width: 100%; height: 62px; }
    #userFunctionsContainer,
	#mainNavigation { display: none; }
	
	/*
	    Theme Top Border & Background Style
	*/
	#lightTheme {
        border-top: 1px solid #ffcc02;
		background-color: #ffffff;
		min-width:100% !important;
		width: 100% !important;
	}
	
    #greyTheme {
        border-top: 1px solid #ffffff;
		background-color: #c3c3c3;
		min-width:100% !important;
		width: 100% !important;
	}
	
	#yellowTheme {
        border-top: 1px solid #ffffff;
		background-color: #ffcc00 !important;
		background-image: none !important;
		min-width:100% !important;
		width: 100% !important;
	}
	
	#blackTheme {
        border-top: 1px solid #ffffff;
		background-color: #000000;
		min-width:100% !important;
		width: 100% !important;
	}
	
	/* 
		Body Contain - Middle Content Holder
	**/
	#bodyInner {
		margin:0;
		padding-top: 20px;
		padding-bottom: 0px;
	}
	
	/* 
	    Structural
	**/
	
	.moduleWrapper { width: 100% !important; }
	
	.moduleWrapper .contentCol,
	.moduleWrapper .contentColPrimary,
	#bodyInner, #footerContainer { 
	    width: auto !important;
		display: block !important; 
	}
	
	.moduleWrapper .contentCol,
	.moduleWrapper .contentColPrimary {
        padding: 0 0 0 20px !important;
	}
	
	/**
		Elements style within various content modules
	**/
	
	/* Image in genericModule */
	.mobileOnly img { 
	    margin: 10px 0 0 10px;
	}
	
	.moduleWrapper h1 {
		font-size: 28px;
	    line-height: 30px;
		margin: 0 20px 20px 0px;
	}
	
	/* expand policy link */
	.moduleWrapper a.expandPolicy,
	.moduleWrapper a.toggled {
        display: block;
		font-family:'HelveticaNeueW01-75Bold';
		font-size: 18px !important;
		margin: 0 0 0 -20px !important;
		padding: 10px 0 10px 20px !important;
		color: #000000;
		text-decoration: none !important;
	}
	
	.moduleWrapper a.toggled {
	    margin: 0 0 15px -20px !important;
	}
	
	.moduleWrapper .policyPanel p {
	    padding-bottom: 25px !important;
		font-size: 14px !important;
	}
	/* End expand policy */
	
	.moduleWrapper h3 {
		width: 100% !important;
		display: block !important;
		font-size: 18px;
		line-height: 20px; 
		margin: 0 0 0 -20px !important;
		padding: 10px 0 10px 20px !important;
		color: #000000;
	}
	
    .moduleWrapper h3.toggled {
	    margin: 0 0 15px -20px !important;
	}
	
	#blackTheme .expandedModule h3,
	#blackTheme .expandedModule a.expandPolicy { 
	    background: #000000 url(/images/campaignV2/toggleArrowBottomWhite.png) no-repeat center right; 
		border-top: 1px solid #343434;
		border-bottom: 1px solid #000000;
	}
	#blackTheme .expandedModule h3.toggled,
	#blackTheme .expandedModule a.toggled { 
	    background: #4e4e4e url(/images/campaignV2/toggleArrowTopWhite.png) no-repeat center right; 
		border-top: 1px solid #717171;
		border-bottom: 1px solid #000000;
	}
	#greyTheme .expandedModule h3,
	#greyTheme .expandedModule a.expandPolicy { 
	    background: #bdbdbd url(/images/campaignV2/toggleArrowBottom.png) no-repeat center right; 
		border-top: 1px solid #d5d5d5;
		border-bottom: 1px solid #abaaaa;
	}
	#greyTheme .expandedModule h3.toggled,
	#greyTheme .expandedModule a.toggled { 
	    background: #979797 url(/images/campaignV2/toggleArrowTop.png) no-repeat center right; 
		border-top: 1px solid #bdbdbd;
		border-bottom: 1px solid #abaaaa;
	}
	#lightTheme .expandedModule h3,
	#lightTheme .expandedModule a.expandPolicy { 
	    background: #ffffff url(/images/campaignV2/toggleArrowBottom.png) no-repeat center right; 
		border-top: 1px solid #b7b7b7;
		border-bottom: 1px solid #ffffff;
	}
	#lightTheme .expandedModule h3.toggled,
	#lightTheme .expandedModule a.toggled { 
	    background: #cccccc url(/images/campaignV2/toggleArrowTop.png) no-repeat center right; 
		border-top: 1px solid #b7b7b7;
		border-bottom: 1px solid #ffffff;
	}
	#yellowTheme .expandedModule h3,
	#yellowTheme .expandedModule a.expandPolicy { 
	    background: #ffcc00 url(/images/campaignV2/toggleArrowBottom.png) no-repeat center right; 
		border-top: 1px solid #ffde5c;
		border-bottom: 1px solid #e7b800;
	}
	#yellowTheme .expandedModule h3.toggled,
	#yellowTheme .expandedModule a.toggled { 
	    background: #cca300 url(/images/campaignV2/toggleArrowTop.png) no-repeat center right; 
		border-top: 1px solid #dec45c;
		border-bottom: 1px solid #e7b800;
	}
	
	.moduleWrapper p {
	    font-family: Verdana, Geneva, sans-serif;
		font-weight: normal;
		margin: 0 !important;
		padding: 0 20px 15px 0 !important;
		font-size: 14px !important;
	}
	
	.moduleWrapper a { 
	    font-size: 14px !important;
		margin: 0!important;
		color: #666666 !important;
	}
	#blackTheme .moduleWrapper a {
	    color: #cccccc !important;
	}
	
	.moduleWrapper .otherLink { 
	    margin: 0 !important;
		color: #000000 !important;
		display: inline-block;
		padding-bottom: 15px;
		width: auto !important;
	}
	
	.expandedModule,
	.expandedModule ul li,
	.expandedModule ol li,
	.expandedModule p,
	.expandedModule a,
	.expandedModule .otherLink {
	    color: #666666 !important;
	}
	.expandedModule a.expandPolicy,
	.expandedModule a.toggled { color: #000000 !important; }
	
	#blackTheme .expandedModule,
	#blackTheme .expandedModule ul li,
	#blackTheme .expandedModule ol li,
	#blackTheme .expandedModule p,
	#blackTheme .expandedModule a,
	#blackTheme .expandedModule .otherLink {
	    color: #cccccc !important;
	}
	#blackTheme .expandedModule a.expandPolicy,
	#blackTheme .expandedModule a.toggled { color: #ffffff !important; }
	
	.moduleWrapper .contentCol ul,
	.moduleWrapper .contentColPrimary ul {
		list-style: none;
		margin: 0 20px 15px 0 !important;
		padding: 0 !important;
	}
	
	.moduleWrapper .contentCol ol,
	.moduleWrapper .contentColPrimary ol,
	.moduleWrapper .darkModule .contentCol ol,
	.moduleWrapper .darkModule .contentColPrimary ol,
	.moduleWrapper .transparentModule .contentCol ol,
	.moduleWrapper .transparentModule .contentColPrimary ol {
		margin: 0 20px 15px 24px !important;
		padding: 0 !important;
	}
	
	.expandedModule .contentCol ul,
	.expandedModule .contentColPrimary ul,
	.expandedModule .contentCol ol,
	.expandedModule .contentColPrimary ol {
		padding: 0 0 15px 0 !important;
		margin: 0 !important;
	}
	
	.moduleWrapper .contentCol ul li,
	.moduleWrapper .contentColPrimary ul li {
		margin: 0;
		padding: 0 0 0 12px;
		font-size: 14px;
		background-position: 0 7px !important;
		color: #666666 !important;
	}
	
    .moduleWrapper .contentCol ol li,
	.moduleWrapper .contentColPrimary ol li {
		margin: 0;
		padding: 0;
		font-size: 14px;
		background-position: 0 7px !important;
		color: #666666 !important;
		list-style-position: inside;
	}
	
	.moduleWrapper .darkModule ul li,
	.expandedModule .darkModule ul li {
	    background: url(/images/campaignV2/greyArrow.gif) no-repeat 0 7px !important;
	}
	
    .moduleWrapper .campaignBtn {
        display: block;
		margin: 0 0 10px 0 !important;
	}
	
    /**
		Module Specific Elements
	**/
	.mediaShare, 
	.expandPolicy { display: none; }
	
	#blackTheme .expandedModule .contentCol,
	#blackTheme .expandedModule .contentColPrimary {
	     background-color: #343434 !important;    
	}
	#greyTheme .expandedModule .contentCol,
	#greyTheme .expandedModule .contentColPrimary {
	     background-color: #d1d1d1 !important;    
	}
	#lightTheme .expandedModule .contentCol,
	#lightTheme .expandedModule .contentColPrimary {
	     /*background-color: #e5e5e5 !important;*/
	     background-color: #ffffff !important;
	}
	#yellowTheme .expandedModule .contentCol,
	#yellowTheme .expandedModule .contentColPrimary {
	     background-color: #ffdb4d !important;    
	}
	
	h2 {
	    color: #000000 !important;
		font-size: 17px;
		margin: 10px 20px 15px 0px !important;
		padding: 0 !important;
		border: none;
		background: transparent;
    }
	#blackTheme h2 {
	    color: #ffffff !important;
	}
	
	/* darkModule style */
	.moduleWrapper .darkModule,
	.moduleWrapper .darkModule .dark33,
	.moduleWrapper .darkModule .dark67 { 
        display: block !important;
		background-image: none !important;
	    padding-bottom: 0px !important;
		margin: 0 !important;
	}
	
	.moduleWrapper .darkModule.webOnly,
	.moduleWrapper .darkModule.webOnly .dark33,
	.moduleWrapper .darkModule.webOnly .dark67 { 
        display: none !important;
		background-image: none !important;
	    padding-bottom: 0px !important;
		margin: 0 !important;
	}
	
	.con2col_5050 .darkModule,
	.con2col_6733 .darkModule,
	.con1col .darkModule,
	.con3col .darkModule,
	.xxcon2col_6733 .xxdarkModuleLarger {
	    background-image: none !important;
	}
	
	.moduleWrapper .darkModule .contentCol {
	    background-image: none !important;
	}
	
	.con2col_5050 .darkModule .contentCol,
	.con2col_6733 .darkModule .contentCol,
	.con1col .darkModule .contentCol,
	.con3col .darkModule .contentCol,
	.con2col_6733 .darkModule .contentColPrimary {
	    background-image: none !important;
		width: auto !important;
	}
	
	.moduleWrapper .darkModule p,
	.moduleWrapper #pointCalculatorTable{ 
	    color: #666666;
		font-size: 14px;
	}
	
	#pointCalculatorTable,
	.pointCalculatorBottom,
	.pointCalculatorBottom .campaignBtn { display: block; }
	
	.pointCalculatorBottom {
	    margin: 0 !important;
	}
	
	.pointCalculatorBottom .campaignBtn {
	    margin-right: 20px;
	}
	
	#pointCalculatorTable {
	    display: block;
		width: 90% !important;
		margin-left: 0px;
	}
	
	#pointCalculatorTable td {
	    width: 50% !important;
		padding: 0 8px 10px 0;
	}
	
	/**
	    Video
	**/
	#videoPlaceHolder {
	    margin-left:-10px;
		width: 100%;
		text-align: center;
		padding: 20px 0 20px 0;
	}
	
	/**
	    Tabulator
	**/
	.tabulator {
	    display: block;
		width: auto;
		z-index: 0 !important;
     }
	
	.expandedModule .contentCol .tabulator,
	.expandedModule .contentColPrimary .tabulator {
	    margin: 0 !important;
		padding: 0 !important;
	}
	
	.tabulator li {
	    display: block;
		width: auto;
		padding: 0 !important;
	}
	.expandedModule .contentCol .tabulator li,
	.expandedModule .contentColPrimary .tabulator li {
	    padding: 0 !important;
	}
	
	#greyTheme .moduleWrapper .tabulator li a,
    #yellowTheme .moduleWrapper .tabulator li a, 
    #lightTheme .moduleWrapper .tabulator li a, 
    #blackTheme .moduleWrapper .tabulator li a {
	    display: block;
		font-size: 18px !important;
		text-decoration: none;
		-webkit-border-radius: 0 !important;
		-moz-border-radius: 0 !important;
		border-radius:0 !important;
		padding: 10px 0 10px 20px !important;
		line-height: 20px !important;
		height: auto !important;
		outline: none;
		margin-left: -20px !important;
	}
	
	#greyTheme .moduleWrapper .tabulator li a,
    #yellowTheme .moduleWrapper .tabulator li a, 
    #lightTheme .moduleWrapper .tabulator li a {
	    color: #000000 !important;	
	}
	#blackTheme .moduleWrapper .tabulator li a {
	    color: #ffffff !important;
	}
	
	.moduleWrapper .tabulator li.selected a {
        color: #000000 !important;
	    height: auto;
	}
	#blackTheme .moduleWrapper .tabulator li.selected a {
        color: #ffffff !important;
	    height: auto;
		border: none;
	}
	
	#lightTheme .moduleWrapper .tabulator li a,
	#lightTheme .moduleWrapper .tabulator li.selected a { 
	    background: #ffffff url(/images/campaignV2/toggleArrowBottom.png) no-repeat center right !important; 
		border-top: 1px solid #b7b7b7;
		border-bottom: 1px solid #ffffff;
		border-left: none !important;
		border-right: none !important;
	}
	#lightTheme .moduleWrapper .tabulator li a.toggled { 
	    background: #cccccc url(/images/campaignV2/toggleArrowTop.png) no-repeat center right !important; 
		border-top: 1px solid #b7b7b7;
		border-bottom: 1px solid #ffffff;
	}
	
	
    #blackTheme .moduleWrapper .tabulator li a,
	#blackTheme .moduleWrapper .tabulator li.selected a { 
	    background: #000000 url(/images/campaignV2/toggleArrowBottomWhite.png) no-repeat center right !important; 
		border-top: 1px solid #343434;
		border-bottom: 1px solid #000000;
		border-left: none !important;
		border-right: none !important;
	}
	#blackTheme .moduleWrapper .tabulator li a.toggled { 
	    background: #4e4e4e url(/images/campaignV2/toggleArrowTopWhite.png) no-repeat center right !important; 
		border-top: 1px solid #717171;
		border-bottom: 1px solid #000000;
	}
	
	#greyTheme .moduleWrapper .tabulator li a,
	#greyTheme .moduleWrapper .tabulator li.selected a { 
	    background: #bdbdbd url(/images/campaignV2/toggleArrowBottom.png) no-repeat center right !important; 
		border-top: 1px solid #d5d5d5;
		border-bottom: 1px solid #abaaaa;
		border-left: none !important;
		border-right: none !important;
	}
	#greyTheme .moduleWrapper .tabulator li a.toggled { 
	    background: #979797 url(/images/campaignV2/toggleArrowTop.png) no-repeat center right !important; 
		border-top: 1px solid #bdbdbd;
		border-bottom: 1px solid #abaaaa;
	}
	
	#yellowTheme .moduleWrapper .tabulator li a,
	#yellowTheme .moduleWrapper .tabulator li.selected a { 
	    background: #ffcc00 url(/images/campaignV2/toggleArrowBottom.png) no-repeat center right !important; 
		border-top: 1px solid #ffde5c;
		border-bottom: 1px solid #e7b800;
		border-left: none !important;
		border-right: none !important;
	}
	#yellowTheme .moduleWrapper .tabulator li a.toggled { 
	    background: #cca300 url(/images/campaignV2/toggleArrowTop.png) no-repeat center right !important; 
		border-top: 1px solid #dec45c;
		border-bottom: 1px solid #e7b800;
	}

	
    .moduleWrapper .tabulator li .tabDisplayCol,
	.moduleWrapper .contentColPrimary .tabulatorCol1 .tabDisplayCol,
	.moduleWrapper .contentColPrimary .tabulatorCol2 .tabDisplayCol,
	.moduleWrapper .contentColPrimary .tabulatorCol3 .tabDisplayCol,
	.moduleWrapper .contentCol .tabulatorCol1 .tabDisplayCol, 
	.moduleWrapper .contentCol .tabulatorCol2 .tabDisplayCol, 
	.moduleWrapper .contentCol .tabulatorCol3 .tabDisplayCol, 
	.moduleWrapper .contentCol .tabulatorCol4 .tabDisplayCol {
		padding: 0 20px 0 0 !important;
		width: auto !important;
	}
	
	.moduleWrapper .tabulator li .tabDisplayCol img {
	    margin: 5px 0 0 0;
	}

	.moduleWrapper .tabulator li .tabDisplayCol h4 {
		color: #000000;
		margin: 10px 0 10px 0 !important;
	}
	
	.moduleWrapper .tabulator li .tabDisplayCol ul { 
	    margin-top: 0 !important; 
		margin-bottom: 0 !important; 
	}
	
	.moduleWrapper .tabulator li .tabDisplayCol ul li {
		list-style: none;
		padding: 0 0 10px 10px !important;
		font-size: 14px !important;
		font-family: Verdana, Geneva, sans-serif !important;
		color: #666666 !important;
		background: url(/images/campaignV2/greyArrow.gif) 0 6px no-repeat !important;
	}
	
	#greyTheme .moduleWrapper .tabulator li .displayTabContent a,
	#yellowTheme .moduleWrapper .tabulator li .displayTabContent a,
	#lightTheme .moduleWrapper .tabulator li .displayTabContent a,
	#blackTheme .moduleWrapper .tabulator li .displayTabContent a {
	    font-size: 14px !important;
		font-weight: normal !important;
		text-decoration: underline !important;
		margin: 10px 0 20px -20px !important;
		padding: 0 0 0 20px !important;
		border: none !important;
		background: none !important;
	}
	
	/**
	    Multi nav
	**/
	.multiSecondaryNav {
        list-style: none;
	    margin: 0 20px 20px 0px !important;
	} 
	
	#yellowTheme .multiSecondaryNav {
	     border-top: 1px solid #ffde5c !important; 
		 border-bottom: 1px solid #e7b800 !important;
	}
	#greyTheme .multiSecondaryNav {
	     border-top: 1px solid #d5d5d5 !important; 
		 border-bottom: 1px solid #abaaaa !important;
	}
	#lightTheme .multiSecondaryNav {
	     border-top: 1px solid #ffffff !important; 
		 border-bottom: 1px solid #e7e6e6 !important;
	}
	#blackTheme .multiSecondaryNav {
	     border-top: 1px solid #343434!important; 
		 border-bottom: 1px solid #000000 !important;
	}
	
	.moduleWrapper .multiSecondaryNav li, 
    .moduleWrapper .multiSecondaryNav li, 
    .moduleWrapper .multiSecondaryNav li, 
    .moduleWrapper .multiSecondarynav li {
	    border: none !important;
		padding: 0 !important;
		margin: 0 !important;
	}
	
	.multiSecondaryNav li a {
		display: block !important;
		color: #000000 !important;
		font-size: 18px !important;
		font-weight: bold;
		text-decoration: none;
		padding: 10px 0 10px 0px !important;
		line-height: 20px !important;
		height: auto !important;
		background: transparent url(/images/campaignV2/toggleArrowRight.png) no-repeat center right !important; 
		margin: 0 !important;
	}
	
	#yellowTheme .multiSecondaryNav li a {
	    border-top: 1px solid #e7b800 !important;
		border-bottom: 1px solid #ffde5c !important;
	}
	#greyTheme .multiSecondaryNav li a {
	    border-top: 1px solid #abaaaa !important;
		border-bottom: 1px solid #d5d5d5 !important;
	}
	#lightTheme .multiSecondaryNav li a {
	    border-top: 1px solid #e7e6e6 !important;
		border-bottom: 1px solid #ffffff !important;
	}
	#blackTheme .multiSecondaryNav li a {
	    border-top: 1px solid #000000 !important;
		border-bottom: 1px solid #343434 !important;
	}
	
	#blackTheme .multiSecondaryNav li a { 
		color: #ffffff !important;
		background: transparent url(/images/campaignV2/toggleArrowRightWhite.png) no-repeat center right !important; 
	}
	
	.multiSecondaryNav .active a {
		color: #000000 !important;
		background: transparent url(/images/campaignV2/toggleArrowRight.png) no-repeat center right !important; 
	}
	#blackTheme .multiSecondaryNav .multiSecondaryNav .active a { 
		color: #ffffff !important; 
		background: transparent url(/images/campaignV2/toggleArrowRightWhite.png) no-repeat center right !important;
	}
	
 
    /**
		Mobile Footer
	**/

	#footerContainMobile {
		background-color: #e8e8e8;
		display: block;
	}

	#footerContainMobile div {
		width: auto;
		margin: 0;
		padding: 0;
	}

	#footerContainMobile div a {
		display: block;
		margin: 0px;
		font-size: 18px;
		font-weight: normal;
		padding: 10px 0 10px 20px;
		text-decoration: none;
		color: #999999;
		border-bottom: 1px solid #f0f0f0;
		background: #e8e8e8 url(/images/campaignV2/bgMobileFooterArrow.png) no-repeat center right;
	}

	#footerContainMobile .connect {
		position: relative;
		color: #999999;
		border-bottom: 1px solid #f0f0f0;
		font-size: 18px;
		font-weight: normal;
		background-image: none !important;
		height: 115px;
		padding: 10px 0 10px 20px;
	}


	#footerContainMobile .connectShare {
		list-style: none !important;
		background: none !important;
		margin: 0 0 0 -7px;
	}

	#footerContainMobile .connectShare li {
		float: left !important;
		list-style: none !important;
		background: none !important;
		padding: 0 10px 0 0;
	}

	#footerContainMobile .connectShare li a {
		margin: 0 !important;
		padding: 0 !important;
		background: none !important;
		border: none !important;
		text-decoration: none !important;
		float: left !important;
	}

	#footerContainMobile p {
		display: block;
		padding: 15px 20px 15px 20px;
		color: #999999 !important;
		margin: 0 !important;
		font-size: 13px;
	}

	/* Blog Footer */

	#footerContainMobile .blogFooter {
		list-style: none !important;
		background: none !important;
		margin: 15px 0 0 -7px;
	}

	#footerContainMobile .blogFooter li {
		list-style: none !important;
		background: url(/images/campaignV2/bgMobileFooterBlog.gif) no-repeat 10px 0 !important;
		padding-left: 52px;
		height: 29px;
	}

	#footerContainMobile .blogFooter li a {
		margin: 0 !important;
		padding: 0 !important;
		background: none !important;
		border: none !important;
		text-decoration: underline !important;
		font-size: 15px !important;
	}
	
	/* Needed for Landscape Mode */
	@media only screen
            and (min-width : 321px) {
                .campaignBtn img { width: 70%; }
    }
	
	.webOnly h3,
	.webOnly p,
	.webOnly h2,
	.webOnly h1 { 
	    display:none !important;
	}