@import "../bell.core.css";

/*!:: Bell Canada UIKit v1.5677

bell.bbm.core.css
Updated : 12:02 PM Friday, October 11, 2013

Development Team: Son Pham, Michel Pen, Simon Buteau, Fernando Saldarriaga
Founder Team: Son Pham, Michel Pen, Simon Buteau, Fernando Saldarriaga
Contributors: -
----------------------------------------------------------------------------
IMPORTANT NOTE:
- Styles in this file will overwrite the bell.core.css and bell.connector.css
----------------------------------------------------------------------------
	Table of contents
	=1.0 General		 	: basic body, headings, fonts, links styles
	=2.0 Shared		 		: shared styles (colors, properties, etc.)
	
	==A) OBE
	=A3.0 UI			 	: Main components styles (includes CSS3 styles)
	=A4.0 Misc			 	: Other uncategorized styles (contexters, etc.)
	=A5.0 jQueryUI		 	: jquery ui related styles
	=A6.0 Utility		 	: Utility classes (text overwrites, alignments, etc.)
	=A7.0 Animation		 	: CSS3 related animations
	=A8.0 Media Queries		: Media queries styles
	
	==B) BSSP
	=B3.0 UI			 	: Main components styles (includes CSS3 styles)
	=B4.0 Misc			 	: Other uncategorized styles (contexters, etc.)
	=B5.0 jQueryUI		 	: jquery ui related styles
	=B6.0 Utility		 	: Utility classes (text overwrites, alignments, etc.)
	=B7.0 Animation		 	: CSS3 related animations
	=B8.0 Media Queries		: Media queries styles
::*/

/*:: =========================================================================== */
/*:: ==1.0 ==General ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */
/* resets the fake H1 to normal H1 styles */
.header h1.headerTitle {
	font-family: "BellSlimMediumRegular", Helvetica, Arial, sans-serif;
	letter-spacing: -1px;
	font-size: 2.833em;
    line-height: 1.1em;
    margin-bottom: 7px;
	margin-left: 0;
	color: #212121;
}


/*:: =========================================================================== */
/*:: ==2.0 ==Shared :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */
/* restores rounded corners, removes these style if button overlap style is used */
	.loginContext .flyOutConnector .flyOutConnectorExtra3 {background-position: -955px 0;}
	.borderradius .loginContext .flyOutConnector {
		-webkit-border-top-right-radius: 4px;
		border-top-right-radius: 4px;
	}

#navigationMain .itemList a,
.navigationMain .itemList a {	
	width: 10em; /* 120px */
}
	#navigationMain .itemList li,
	.navigationMain .itemList li {
		margin-left: 5px; 
		margin-right: 5px;

	}
		/* For BBM, active state is also the unactive state : move to new theme/utility if needed */
		/* This is some duplicated css from the active state */
		.itemListThemeA a,
		.itemListThemeA .itemListExtra1,
		.itemListThemeA .itemListExtra3	{
			background-image: url(../../images/bg_miscSprite.png);
		}
			.itemListThemeA li {
				background-repeat: repeat-x;
				background-position: 0 1px;
			}
			.itemListThemeA li,		
			.itemListThemeA .itemListExtra1, 
			.itemListThemeA .itemListExtra3 {
				background-color: transparent;
			}
			.itemListThemeA a {
				background: transparent url(../../images/bg_gradientMask_c.png) repeat-x 0 top; /* <- needs to be top absolutely - do not even think about changing it */
				
				/* scales depending on the height of the element - see IEs css for filters properties */
				background-size: auto 100%;
			}
				.itemListThemeA a {border-color: #bababa; position: static;}
				
				.itemListThemeA .itemListExtra1, .itemListThemeA .itemListExtra2, 
				.itemListThemeA .itemListExtra3, .itemListThemeA .itemListExtra4 {
					display: block; /* <- unhides the extras */
				}

		/* =navigationThemeA */
		.itemList a {
			vertical-align: middle;
			display: block;
			height: 100%;
		}
		.itemList a:hover {text-decoration: none;}
		.itemList a:hover .itemListContent {text-decoration: underline;}

/* Custom trigger for default select dropdown behavior = transfer to bell.core if used elsewhere */				
.formSelectCustom select {
	position:relative; 
	opacity: 0; 
	height: 34px; 
	filter:alpha(opacity=0);
}
	.formSelectCustom select:hover {cursor: pointer;}
	.formSelectCustomTrigger {position: absolute;}

	
	
	

	
/*:: ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/*:: ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*:: ==A ==OBE ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*:: =========================================================================== */
/*:: ==A3.0 ==UI ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==A4.0 ==Misc ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */
.obeContext .navigationContext {float: right;}
	.obeContext .navigationContext a.control {width: auto;}
		.obeContext .navigationContext a.control .iconConnectorArrow {background-position: -32px 0;}
	.obeContext .connectorThemeA .navigationContext a.control.last {
		-webkit-box-shadow:  inset 1px 0px 0px 0px #1477bb, 1px 0px 0px 0px #1477bb;
		box-shadow:  inset 1px 0px 0px 0px #1477bb, 1px 0px 0px 0px #1477bb;
	}
	.obeContext .connectorThemeA .navigationContext a.control.last:hover {
		-webkit-box-shadow:  1px 0px 0px 0px #1477bb;
		box-shadow:  1px 0px 0px 0px #1477bb;
	}

/* flyouts positionning #! if JS does not handle its position, otherwise remove these */
.flyOutViewingAllAccountsContext {top: 55px; width: 390px; left: 0;} 
.borderradius .flyOutViewingAllAccountsContext {top: 40px;}

.flyOutExportTableContext {top: 54px; width: 224px;}
	.flyOutExportTableContext .listViewContent {width: 75%;}
	.flyOutExportTableContext .flyOutArrow {left: 25%;}
.borderradius .flyOutExportTableContext {top: 39px;}

.filtersContext {margin-bottom: 20px;}
	.filtersContext .column, .filtersContext .formSelect {margin-bottom: 0;}
			.box .box .filtersContext .formSelect .formContent,
			.filtersContext .formSelect .formContent	{margin-left: 0; margin-right: 0;}
		.filtersContext .formText {top: 3px; margin-bottom: 0;}
		.filtersContext .formSelectCustomTrigger {top: 1px;}

.newBankAccountContext, .newCreditCardContext {position: relative;}
.newBankAccountContext .iconArrow, .newCreditCardContext .iconArrow {
	position:absolute; 
	left:270px; 
	top:-30px;
	width:30px; 
	background:url('../../images/bg_navigationSprite_small_a.png') 0 -849px no-repeat;
}

/* This is for QA Tool templates only */	
.flyOutExportRowContext,
.borderradius .flyOutExportRowContext { right: -23px; top: 30px; width: 200px; }
.flyOutExportRowContext .flyOutArrow,
.borderradius .flyOutExportRowContext .flyOutArrow { left: 164px; }

.loginFromTableContext .buttonGroup {
	visibility: hidden;
	white-space: nowrap;
}
.loginFromTableContext tr:hover .buttonGroup {
	visibility: visible;
}

/*:: =========================================================================== */
/*:: ==A5.0 ==jQueryUI ::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==A6.0 ==Utility :::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==A7.0 ==Animation :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==A8.0 ==Media Queries :::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */











/*:: ||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||||| */
/*:: ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*:: ==B ==BSSP :::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ */
/*:: =========================================================================== */
/*:: ==B3.0 ==UI ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */
.bsspContext .navigationContext {margin-left: 85px;}
	.bsspContext .navigationContext a {text-align: left;} /* theme>? */
	.bsspContext .navigationContext a.control {width: 140px;}

/* fixes wrapping issue when one the container have text that are too long, content will now always wrap based on thw specified with below. */
.bsspContext .sideBar .itemListFunctionB .itemListContent {width: 55%;} 
.bsspContext .sideBar .itemListFunctionB .itemListAside {width: 45%;}


/*:: =========================================================================== */
/*:: ==B4.0 ==Misc ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==B5.0 ==jQueryUI ::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==B6.0 ==Utility :::::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==B7.0 ==Animation :::::::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */



/*:: =========================================================================== */
/*:: ==B8.0 ==Media Queries :::::::::::::::::::::::::::::::::::::::::::::::::::: */
/*:: =========================================================================== */