/***********************************************************************
* Common styles for the Mobile templates
************************************************************************/
* 
{
    /* prevent callout to copy image, etc when tap to hold */
   -webkit-touch-callout: none;
    /* prevent webkit from resizing text to fit */
   -webkit-text-size-adjust: none; 
   /* make transparent link selection, adjust last value opacity 0 to 1.0 */
   -webkit-tap-highlight-color: rgba(0,0,0,0);
   /* prevent copy paste, to allow, change 'none' to 'text' */
   -webkit-user-select: text; 
}

body, html
{
	margin: 0;
	padding: 0;
	border: 0;
	background-color: White;
	font-family: Helvetica, sans-serif;
	width: 100%;
	height: 100%;
	font-size: 12px;
}

/* max width (100%) */
div.maxWidth
{
	width: 100%;
}

/* Application Caption bar (located at the top) */
div.captionBar
{
	background-color: #3A3E40; /* Old Browsers */
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#4A4E50), to(#3A3E40));
	background-image: -moz-linear-gradient(0% 0% 270deg, #4A4E50, #3A3E40);
	filter: progid:DXImageTransform.Microsoft.Gradient(startColorstr='#4A4E50', endColorstr='#3A3E40', gradientType='0');
}

div.captionBar img.helpIcon
{
	float: right;	
	margin-top: 6px; /* (34px - 22px)/2 = 6px */
	margin-right: 5px;
}

/* Branding bar */
div#idHeader
{
	z-index: 600;
	width: 100%;
	height: 34px; /* Should match images.css:img.brandingCaption class */
}

/* Application Context bar (located at the bottom) */
div#idFooter
{
	z-index: 200;
	width: 100%;
	height: 48px;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#545656), to(#000000), color-stop(.5, #292929), color-stop(.5, #000000));
	position: absolute;
	bottom: 0px;
	border-bottom: 2px solid black; 
	border-top: 1px solid black;
	background-position: center bottom;
}

div#idFooter ul
{
	margin: 0 2px;
	list-style: none;
	display: block;
	height: 100%;
	text-align: center;
	overflow: hidden;
	padding: 0;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#3B3B3B), color-stop(0.5, #1D1D1D), color-stop(0.5, black), to(black));
	border-top: 1px solid #545454;
}

div#idFooter .ctxButton, #idMore, #idPrevItem, #idNextItem
{
	float: left;
	position: relative;
	height: 42px; 
	margin: 1px 0; 
	padding-top: 1px; 
}

#idPrevItem, #idNextItem
{
	margin: 1px 1px;
	float: right;
}

div#idFooter ul li
{
	-webkit-border-radius: 3px;
}

div#idFooter ul li span
{
	color: #C6C6C5;
	height: 100%;
	color: #bbb;
	font-weight: bold;
	font-size: 10px;
	text-decoration: none;
	line-height: 2px;
}

/* Highlighted context */
div#idFooter ul li.selectedContext
{
	background-color: rgba(255, 255, 255, 0.199219);
	-webkit-border-radius: 3px;
	color: white;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#717171), to(#151515), color-stop(.5, #505050), color-stop(.5, #303030));
}

/* Switch font color to white for the selected context */
div#idFooter ul li.selectedContext span, div#idItemNav li span
{
	color: white;
}

/* Container for Next and Previous item buttons */
div#idItemNav li
{
	background-color: rgba(255, 255, 255, 0.199219);
	-webkit-border-radius: 3px;
}

/* Novell logo */
img.novellLogo
{
	background-image: url( '../../images/novell.png' );
	background-repeat: no-repeat;
	width: 64px;
	height: 34px;
	right: 0px;
	position: absolute;
	background-position: 0px 0px;
	display: none;
}

/* Generic Styles */
.textAlignCenter
{
	text-align: center;
}

.textAlignRight
{
	text-align: right;
}

.textAlignReverse_ltr
{
	text-align: right;
}

.textAlignReverse_rtl
{
	text-align: left;
}

.italicFont, .unacceptedItem
{
	font-style: italic;
}

.unreadItem
{
	font-weight: bold;
}

/* Overflowed text will be truncated with "..." */
.overflowEllipsis
{
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/* Browser will not allocate space for the element */
.hidden
{
	display: none;
}

/* Browser will allocate space for the element */
.invisible
{
	visibility: hidden;
}

/* Generic "Loading..." popup */
div#idLoading
{
	-webkit-border-radius: 15px;
	background-color: rgba(0, 0, 0, 0.5);
	color: white;
	font-size: 16px;
	font-weight: bold;
	margin: 0 auto;
	position: absolute;
	text-align: center;
	top: 40%; /* positioned approximately at center the first time (then accurately using JS later) */
	left: 45%; /* positioned approximately at center the first time (then accurately using JS later) */
	z-index: 800;
	padding: 30px;
}

/* To place a div at the center with respect to its parent node */
div.centerDiv
{
	margin: 0 auto; /* should match padding-top of div.itemViewNoItems */
	text-align: center;
	padding-top: 20px;
	padding-bottom: 20px;
}

/* Additional bottom padding required on bottom button, so that the floating toolbar isn't hidden */
div.additionalBottomPadding
{
	padding-bottom: 60px !important;
}

/* Additional bottom margin required on bottom button, when top and bottom buttons are displayed */
div.additionalBottomMargin
{
	margin-bottom: 40px !important;
}

/* Position a node on the left side: ul, span, etc */
.posLeft
{
	left: 1%;
	top: 0px;
	position: absolute;
}

/* Position a node on the right side: ul, span, etc */
.posRight
{
	right: 1%;
	top: 0px;
	position: absolute;
}

.posRightRelative
{
	position: relative;
}

.white_bg
{
	background-color: rgb(255, 255, 255) !important;
}

.disabledOpacity
{
	opacity: 0.6;
}

.lowPriority
{
	opacity: 0.75;
}

.errorText
{
	color: #c82727 !important;
}

/* Bevel ruler */
div.bevel
{
	border-top: 1px solid #3098C4;
	border-bottom: 1px solid #9DCDED;
	width: 100%;
}

div.webkitBoxStretch
{
	-webkit-box-align: stretch;
	-webkit-box-orient: horizontal;
	display: -webkit-box;
}

.webkitBoxFlex0
{
	-webkit-box-flex: 0;
	display: block;
}

.webkitBoxFlex100
{
	border-style: none;
	-webkit-appearance: none;
	-webkit-box-flex: 100;
	display: block;
	width: 100%;
}

.borderNone
{
	border-style: none;
	-webkit-appearance: none;
}

div.bgFiller
{
	width: 100%;
	height: 100%;
	z-index: 100;
	position: absolute;
	background-color: rgb(196, 196, 196);
}

/*-----------------------------------------------------------------------*/
/* WebAccess-specific branding styles for Product, Version, Copyright... */
/*-----------------------------------------------------------------------*/
.version
{
	font-size: 9pt;
	color: #FFFFFF;
}

.aboutVersion1
{
	font-size: 20px;
}

.aboutVersion2
{
	font-size: 13px;
}

.copyright
{
	font-size: 9px;
	color: White;
	margin: 0;
    padding: 5px 0px;
}

span.copyright
{
	display: inline-block;
	width: 85%;
}

div.versionText .copyright, p.copyright
{
	padding: 5px 0px;
}



/***********************************************************************
* Buttons, Buttons, Buttons!
* Different types of buttons: Icon-only, Text-only with gray background,
* Text-only with transparent background, Icon+Text, etc. 
************************************************************************/
.buttonContainer, .buttonContainerText, .buttonBasic
{
	-webkit-box-sizing: border-box;
	-webkit-box-align: center;
}

/* TODO - Image-only buttons??? */
.buttonContainer, .buttonContainerDatePicker
{
	margin: 2px 4px;
	padding: 4px 9px;
	display: inline-block;
	max-height: 34px; /* TODO: Check if this is the best way to do this or not? */
	font-size: 11px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	border: 1px solid transparent;
}

/* Text-only Back buttons: Folders, Find, Calendar */
div.backButton
{
	margin: 0px 2px;
	max-width: 80px; /* Magic number: matches with Refresh and Compose buttons width+spacing - 10(right.slice) - 18(left.slice) */
	-webkit-border-image: none;
	-webkit-box-align: stretch;
	-webkit-box-sizing: content-box;
	-webkit-border-image: url('../../images/btnnor_back_bgmobile.png') 0 10 0 18 stretch stretch;
	border-style: solid;
	border-width: 0px 10px 0px 18px;
}

/* Text-only non-toolbar buttons: Show More, Find, Today in Date Picker */
.nonToolbarButton
{
	background: #59828F url(../../images/btnnor_bgmobile.png) no-repeat scroll center center;
	border: 1px ridge #999;
	line-height: 18px;
}

/* Text Styling for text-only buttons: Show More, Find, Today in Date Picker, Folders (back), Find (back) */
.buttonText
{
	font-size: 12px;
	font-weight: bold;
	color: #FFFFFF;
	text-align: center;
	text-shadow: rgba(0, 0, 0, 0.558594) 0px -1px 1px;
}

/* Text-only buttons with transparent background: Send, Accept, Decline, etc */
.buttonContainerText
{
	margin: 1px 4px;
	padding: 0 9px;
	max-height: 34px; /* TODO: Check if this is the best way to do this or not? */
	border-radius: 4px;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	color: #676867;
	font-size: 14px;
	text-align: center;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.8);
	border: 2px solid #888988;
	box-shadow: 0 1px 0 RGBA(255,255,255,0.4) inset, 0 1px 0 RGBA(255,255,255,0.4);
}

.textButtonDlg
{
	color: #3E6978;
	border-color: #6C99A6;
	background-color: white;
	border-radius: 5px;
}

/* Text styling for the text-only buttons with transparent background: Send, Accept, Decline, etc */
.buttonTextNormal
{	
	margin: 2px 4px;
	padding: 4px 9px;
	font-weight: normal;
}

/* Used in compose - TODO: Can we consolidate? */
.buttonBasic
{	
	-webkit-box-orient: horizontal;
	display: -webkit-box;
	line-height: 22px;
	max-height: 34px; /* TODO: Check if this is the best way to do this or not? */
	list-style-type: none;
	margin: 0px;
	padding: 5px 3px 5px 3px;
	color: #676867;
	text-align: center;
	text-shadow: 0 1px 0 rgba(255, 255, 255, 0.592);
}

/* Text-only buttons without borders and teal font color (Date label in Cal context) */
.buttonClickableText
{
	border: none;
	color: #59828F;
	font-size: 18px;
	font-weight: bold;
}

.buttonSelected
{
}

.ftoolbarButtonSelected
{
	background-color: RGBA(255,255,255,0.2); 
	border-radius: 3px;	
}

.toolbarButtonSelected
{
	 -webkit-box-shadow: rgba(255, 255, 255, 0.898438) 0px 0px 2px; 
	 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#C6C6C6), color-stop(0.04, #F2F2F2), color-stop(0.08, white), color-stop(0.96, white), to(#E9E9E9));
	 border: 1px solid #5C8A99;
	 border-radius: 5px;
}

.buttonContainerDatePicker
{
	display: inline;
	border-color: rgba(92, 138, 153, 0.5);
	background: -webkit-gradient(linear,0% 0,0% 100%,from(rgba(233, 233, 233, 0.5)),color-stop(0.04,rgba(255, 255, 255, 0.5)),color-stop(0.08,rgba(242, 242, 242, 0.5)),color-stop(0.96,rgba(242, 242, 242, 0.5)),to(rgba(198, 198, 198, 0.5)));
	-webkit-box-shadow: rgba(255, 255, 255, 0.5) 0 0 2px;
}

ul.showHideList
{
	padding: 0;
}

span.textImgButton, li.textImgButton, li.itemViewListButton
{
	margin-top: 0px;
	padding-top: 3px;
	max-height: 28px; /* TODO: Check if this is the best way to do this or not? */
}

li.itemViewListButton
{
	padding-top: 5px;
}

li.backToParent
{
	background-color: #F5C04D;
	color: #1F1F1F;
	max-width: 150px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

span.textImgButton img
{
	vertical-align: middle;
}

div#idComposeDialog li.textImgButton
{
	padding-top: 2px;
}

/* Compose dialog: Start and end dates input nodes */
.inputButton
{
	padding-top: 3px;
	padding-bottom: 3px;
	font-size: 14px;
	background: -webkit-gradient(linear, 0% 100%, 0% 0, from(#D0D0D0), to(#FEFEFE));
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border: 1px solid #4C4C4C;
	text-align: center;
}

/* Compose dialog: Busy level select control */
.selectControl
{
	padding: 3px 0;
	font-size: 14px;
}

/***********************************************************************
* Login page styles
************************************************************************/
div.loginRootContainer
{
	min-height: 98%;
	overflow: hidden;
	margin: auto;
}

div.loginRootContainer div.loginInnercontainer
{
	height: 99%;
	margin: 8px;
	border: 1px solid transparent;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.4);
	border-radius: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
/* 
    Added to display correctly the logo section at login page
    this will appear only when User.lang == ar || User.lang == iw
        See bug 701340 
*/
.loginLogoContainer
{
    direction: ltr;
}

/* Data section in the login container in Login page, version container in About dialog */
div.loginSection
{
	margin: 14px 24px;
	color: #FFFFFF;
}

/* product logo on the login panel */
div.loginSection div.logo
{
	padding-bottom: 2px;
}

div.bottomPadding10
{
	padding-top: 5px;
}

/* Username and Password labels */
div.loginSection p.loginLabel
{
	font-size: 13px;
	line-height: 20px;
}

/* For Arabic Language: Username and Password labels */
div.loginSection p.loginLabelArabic {  
    font-size: 13px;
    line-height: 20px;
}

/* Public and private timeout section table */
div.loginSection table#idTimeOutOption
{
	width: 100%;
	padding: 0px;
	margin: 0px;
}

/* Public and private timeout section table row */
div.loginSection table#idTimeOutOption tr
{
	vertical-align: top;
}

/* Login controls styling (margin is required for the right alignment on iPad) */
div.loginSection p#idLangOption
{
	width: 100%;
	margin-right: 20px;
}

/* For Arabic Login controls styling (margin is required for the right alignment on iPad) */
div.loginSection p#idLangOptionArabic {
    margin-left: 20px;
    width: 100%;
}


/* Login controls styling */
div.loginSection p.loginLabel input[type="text"],div.loginSection p.loginLabel input[type="password"], div.loginSection #idLangSelect, div.loginSection p.loginLabelArabic input
{
	border: none;
	font-size: 13px;
	width: 100%;
	border-radius: 4px;
	padding: 2px 0px;
}

div.loginSection p.loginLabel input.mfLoginTextboxes
{
	width: 77% !important;
	background-color: rgb(43, 61, 68) !important;
	color: White !important;
	border: 1px solid #606365;
	border-radius: 0px !important;
	padding: 8px 8px 8px 47px;
	background-repeat: no-repeat;
	background-position: 17px 50%;
	margin: 0px; /* Hack for Safari */
}

input#username
{
	border-bottom: 0px;
}

div.loginSection p.loginLabel input.webkitbrowser:-webkit-autofill,
div.loginSection p.loginLabel input.webkitbrowser:focus:-webkit-autofill,
div.loginSection p.loginLabel input.webkitbrowser:active:-webkit-autofill,
div.loginSection p.loginLabel input.webkitbrowser:hover:-webkit-autofill
{
	-webkit-box-shadow:0 0 0 20px #0078EF inset !important;
	-webkit-text-fill-color: White !important;
	border-color: rgb(56, 194, 255) !important;
	color: White !important;
	outline: none !important;
}

/* Color for "placeholder" text on Chrome and Safari */
div.loginSection p.loginLabel input.mfLoginTextboxes::-webkit-input-placeholder
{
	color: #add5f1 !important;
}
/* Firefox 19+ */
div.loginSection p.loginLabel input.mfLoginTextboxes::-moz-placeholder
{
	color: #add5f1 !important;
}
/* IE 10+ */
div.loginSection p.loginLabel input.mfLoginTextboxes:-ms-input-placeholder
{
	color: #add5f1 !important;
}
/* Firefox 18- */
div.loginSection p.loginLabel input.mfLoginTextboxes:-moz-placeholder
{
	color: #add5f1 !important;
}

/* Background and text colors for the selected text on Chrome and Safari */
div.loginSection p.loginLabel input.webkitbrowser::selection 
{
	background-color: #29ceff !important;
	color: black !important;
}

div.loginSection p.loginLabel input.mfLoginTextboxes::-moz-selection
{
	background-color: #29ceff !important;
	color: black !important;
}

div.loginSection p.loginLabel input.bgImgUsername
{
	background-image: url( '../../images/username-user-icon.png' ) !important;
}

div.loginSection p.loginLabel input.bgImgPassword
{
	background-image: url( '../../images/password-lock-icon.png' ) !important;
}

div.loginSection p.loginLabel input:focus
{
	xbox-shadow:-1px -1px 1px #CCC, 1px -1px 1px #CCC, -1px 1px 1px #CCC, 1px 1px 1px #CCC;
	color: White !important;
}

div.loginSection p.loginLabel img.webkit-img-hack
{
	position: absolute;
}

div.loginSection a.help, div.loginSection a.helpdesk, div.loginSection a.helpdeskArabic, div.loginSection p.loginLabel span, .aboutDialogData, p.copyright, p.copy span
{
	color: #ADD5F1;
}

/* Help link */
div.loginSection a.help
{
	font-size: 11px;
	text-decoration: none;
}

/*Can't login syling*/
div.loginSection a.helpdesk {
    font-size: 11px;
    text-decoration: none;
    float: right;
}

/*For Arabic Language: Can't login syling*/
div.loginSection a.helpdeskArabic {
    font-size: 11px;
    text-decoration: none;
    float: left;
}

div.loginSection span.settingsCog
{
	display: inline-block;
	float: right;
}

div.loginSection span.settingsCog img.imgDownArrow
{
	vertical-align: super;
}

/* Settings and Login button */
div.loginSection input.loginButton, div.loginSection input.loginButton:hover
{
	background-image: linear-gradient(to bottom, #F9F9F9 0%, #E9E9E9 100%);
    border-color: #F9F9F9 #E0E0E0 #E0E0E0;
    border-image: none;
    border-radius: 3px;
    border-style: solid;
    border-width: 1px;
    /*box-shadow: 0 -1px 0 0 #E4E4E4 inset;*/
    color: #1F1F1F;
    cursor: pointer;
    display: inline;
    font-size: 12px;
    margin: 15px 0 8px;
    padding: 5px 20px;
}

/* Safari Hack - Settings and Login button */
div.loginSection input.safariButton, div.loginSection input.safariButton:hover
{
	background-color: #E9E9E9;
}

div.loginSection p input.loginButton, div.loginSection p input.loginButton:hover
{
	margin-top: 5px !important;
}

/*For Arabic Language: Settings and Login button */
div.loginSection input.loginButtonArabic
{
	color: White;
	border-radius: 11px;
	-moz-border-radius: 11px;
	-webkit-border-radius: 11px;
	margin: 0 10px 0 0px;
	background: #59828F url(../../images/mobile2.png) no-repeat scroll center -127px !important;
	padding: 0px 10px 1px 13px;
	border: medium none;
	height: 22px;
}

/* Login(submit) button with the arrow */
div.loginSection input.submitButton, div.loginSection input.submitButton:hover
{
	xbackground: #59828F url(../../images/mobile2.png) no-repeat scroll right -127px !important;
	width: 100% !important;
	background: #345665 !important;
	border-color: #345665 !important;
	color: White !important;
	border-radius: 25px;
}

/*For Arabic Language: Login(submit) button with the arrow */
div.loginSection input.submitButtonArabic {
    background:#59828F url(../../images/mobile2arabic.png) no-repeat scroll left -127px !important;
}

/***********************************************************************
* WebAcc Main Page styles - Mailbox, Find, Calendar
************************************************************************/
body#idWebAcc
{
	min-height: 320px; /* TODO TODO TODO */
	max-height: 100%;
}

/* Workspace container for all contexts */
div.workspace
{
	width: 100%;
	background: white !important;
}

/* Item list container in Mail and Find contexts */
div.workspace div.itemListContainer
{
	border-right: 1px solid #555; /* color should match with div.toolbarShadowParent background */
}

/* Mail and Find item list container, item view container in all 3 contexts */
div.workspace div.itemListContainer, div.workspace div.itemViewContainer, div.workspace div.calItemListContainer
{
	height: 100%;
	overflow: hidden;
}

/* Item list conatiner in all contexts */
div.workspace div.itemListContainer, div.workspace div.calItemListContainer
{
	float: left;
	clear: none;
}

/* item view container in all 3 contexts */
div.workspace div.itemViewContainer
{
	background-color: #ededed;
}

/*-----------------------------------------------------------------------*/
/* Item List panel														 */
/*-----------------------------------------------------------------------*/
/* Item list container (without the toolbar at the top) in Mail and Find contexts */
div.itemListPanel
{
	border-right: 1px solid #fff;
	background: white !important;
}

/* Note: div.msgList is child node of div.itemListPanel */
div.msgList
{
	width: 100%;
	background-color: White !important;
}

div.msgList table
{
	width: 100%;
	max-width: 100%;
	border-collapse: separate;
	table-layout: fixed;
}

div.msgList table.topBorder
{
	border-top: 1px solid #F3F3F3;
}

div.msgList table tbody
{
	height: 85px;
}

div.msgList table tbody.itemContainer tr.firstRow td
{
	border-top: 1px solid white;
	padding-top: 5px;
}

div.msgList table tbody.firstItem tr.firstRow td
{
	border-top-color: #EEE;
}

div.msgList table tbody.itemContainer tr.lastRow td, tbody.itemContainer tr td.checkbox
{
	border-bottom: 1px solid #F3F3F3;
	padding-bottom: 5px;
}

div.msgList table tbody.itemContainer td.rightBorder
{
	padding-right: 2px;
}

div.msgList table tbody.itemContainer .itemFrom, div.msgList table tbody.itemContainer .itemDate
{	
	line-height: 20px;
}

div.msgList table tbody.itemContainer .itemFrom
{
	color: #1F1F1F;
	font-size: 16px;
}

div.msgList table tbody.itemContainer .itemDate
{
	font-size: 13px;
	color: #505354;
}

div.msgList table tbody.itemContainer .itemSubject
{
	color: #1F1F1F;
	font-size: 14px;
	line-height: 20px;
}

div.msgList table tbody.itemContainer .itemMsgPreview, div.msgList table tbody.itemContainer .itemFolderName
{
	color: #949494;
	font-size: 12px;
	line-height: 18px
}

/* Folder name is shown in Find results */
div.msgList table tbody.itemContainer .itemFolderName
{
	color: Gray;
	text-align: center;
}

/* Folder name is shown in Find results */
div.msgList table tbody.itemContainer .itemFolderNameContainer
{
	border: 1px solid #ccc;
	margin-left: 4px;
	padding: 2px 4px;
	-webkit-border-radius: 5px;
}

/*-----------------------------------------------------------------------*/
/* Highlight the selected item in the item list in Mail and Find contexts */
/*-----------------------------------------------------------------------*/
div.msgList table tbody.selectedNode .itemMsgPreview, div.msgList table tbody.selectedNode .itemFolderNameContainer
{
	color: #505354;
}

div.msgList table tbody.selectedNode .itemFolderNameContainer
{
	border-color: #999;
}

div.msgList table tbody.selectedNode tr.firstRow td
{
	border-top-color: #9DE1E3;
}

div.msgList table tbody.selectedNode tr.lastRow td, div.msgList table tbody.selectedNode tr td.checkbox
{
	border-bottom-color: #9DE1E3;
}

/*-----------------------------------------------------------------------*/
/* Toolbars																 */
/*-----------------------------------------------------------------------*/
div.itemlistToolbar, div.itemViewToolbar, div.calMainToolbar
{
	border-top-left-radius: 5px;
	border-top-right-radius: 5px;
}

div.itemlistToolbar, div.itemViewToolbar, div.calMainToolbar, div.composeToolbarTop, div.composeToolbarBottom, div.smallDlgToolbar
{
	background: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#B8B8B8), color-stop(0.8, white), to(#EDEDED));
}

/* All toolbars */
div.itemlistToolbar, div.itemViewToolbar, div.calMainToolbar, div.calNavBar, div.composeToolbarTop, div.composeToolbarBottom, div.smallDlgToolbar, div.toolbarShadowParent
{
	-webkit-box-align: center;
	-webkit-box-orient: horizontal;
	display: -webkit-box;
	line-height: 32px;
	max-height: 38px;
	min-height: 38px;
	z-index: 100 !important;
	position: relative;
}

/* Virtual shadow parent for main toolbars */
div.toolbarShadowParent
{
	background-color: #555 !important; /* color should match div.workspace div.itemListContainer border */
	width: 100%;
	margin: 0px;
	padding: 0px;
	border: 0px;
}

/* Item list toolbar in all contexts */
div.itemlistToolbar, div.calMainToolbar
{
	margin: 0px;
	padding: 0px;
	vertical-align: middle;
}

div.itemViewToolbar, div.composeToolbarTop, div.composeToolbarBottom, div.smallDlgToolbar, div.calMainToolbar
{
	width: 100%;
	white-space: nowrap;
	overflow: hidden;
}

div.composeToolbarBottom
{
	-webkit-border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
}

/* Toolbar label positioned at the center */
span.toolbarLabel
{
	margin-left: 2px;
	margin-right: 2px;
	-webkit-box-flex: 1;
	display: block;
	font-size: 18px;
	text-shadow: 0 1px 0 #FFFFFF;
	font-weight: bold;
	color: #000000;	
	height: 38px;
	line-height: 42px;
	text-align: center;

	/* HACK: Used to poistion the toolbar label at the center.
	* in item list toolbar and folder tree toolbar. The maigc 
	* number is 18px, which makes the label to appear centered.
	*/
	padding: 0px 0px 0px 18px;
}

/*-----------------------------------------------------------------------*/
/* Floating Toolbar on Message List										 */
/*-----------------------------------------------------------------------*/
.floatingToolbarBorder
{
	-webkit-border-radius: 5px;
	z-index: 300;
	position: absolute;
	text-shadow: rgba(0, 0, 0, 0.558594) 0px -1px 1px;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(rgba(35,35,35,0.792969)), color-stop(0.49, rgba(59, 59, 59, 0.792969)), color-stop(0.49, rgba(0, 0, 0, 0.792969)), to(rgba(0, 0, 0, 0.792969)));
	height: 60px;
	margin: 3px;
	bottom: 47px;
}

.floatingToolbarContent
{
	z-index: 300;
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4B838), color-stop(0.5, #f5c04d), color-stop(0.5, #f2ad18), to(#D69215));
	-webkit-border-radius: 3px;
	margin: 6px;
	position: relative;
	height: 48px;
}

.floatingTBClose
{
	float: left;
	margin-top: 5px;
}

.floatingTBTrashMenu
{
	float: right;
	margin-top: 5px;
}

.floatingTBSelectedCount
{
	margin-left: 70px;
	margin-top: 12px;
	position: absolute;
	color: Black !important;
	font-family: helvetica;
	font-size: 20px !important;
	font-weight: bold;
	text-shadow: rgba(0, 0, 0, 0.558594) 0px -1px 1px;
	display: inline;
}

.yellowCheckboxHolder
{
	width: 24px;
	height: 24px;
	display: inline-block;
}

input[type="checkbox"].yellowCheckbox
{
	width: 20px;
	height: 20px;
	background-image: url( '../../images/mobile1.png' );
	background-repeat: no-repeat;
	background-position: -44px -82px;
	background-color: transparent;
	-khtml-appearance: none;
	-webkit-appearance: none;
	border: none !important;
}

input[type="checkbox"].yellowCheckbox:checked
{
	width: 23px;
	height: 23px;
	background-position: -44px -105px;
}

/***********************************************************************
* Toolbar with Left, Center and Right sections
************************************************************************/
table.lmrToolbar
{
	width: 100%;
	table-layout: fixed;
	white-space: nowrap;
	height: 100%;
}

table.lmrToolbar tr td
{
	overflow: hidden;
}

table.lmrToolbar tr td.left
{
	text-align: left;
}

table.lmrToolbar tr td.middle
{
	text-align: center;
}

table.lmrToolbar tr td.right
{
	text-align: right;
}

table.lmrToolbar tr td span
{
	vertical-align: middle;
}

/***********************************************************************
* Folders panel
************************************************************************/
div.folderTree
{
	background-color: White !important;
}

div.folderTree table
{
	width: 100%;
	max-width: 100%;
	border-collapse: separate;
	table-layout: fixed;
}

div.folderTree table tbody.folderContainer
{
	border: 1px solid #DDD;
}

div.folderTree table tbody.folderContainer td
{
	line-height: 40px;
	border-top: 1px solid #FFF;
	border-bottom: 1px solid #F3F3F3;
	font-size: 1em;
}

div.folderTree table tbody.folderContainer tr.firstRow td
{
	border-top-color: #F3F3F3;
}

div.folderTree table tbody.folderContainer td span
{
	padding-bottom: 15px;
	padding-top: 15px;
}

div.folderTree table tbody.folderContainer td span.folderName
{
	color: #1F1F1F;
	font-weight: bold;
}

div.folderTree table tbody.folderContainer td span img
{
	margin-left: 3px;
	margin-right: 3px;
}

/*-----------------------------------------------------------------------*/
/* Highlighting to indicate the selected folder in the folder tree		 */
/*-----------------------------------------------------------------------*/
div.folderTree table tbody.selectedNode tr td
{
	border-top-color: #9DE1E3 !important;
	border-bottom-color: #9DE1E3;
}

/***********************************************************************
* Calendar Workspace
************************************************************************/
div.calItemListContainer
{
	width: 100%;
}

div.calItemListPanel
{
	background: white !important;
}

div.calItemList
{
	background-color: White !important;
}

div.calItemList table
{
	width: 100%;
	max-width: 100%;
	border-collapse: collapse;
	table-layout: fixed;
}

div.calItemList table tbody
{
	border: 1px solid #EEE;
}

div.calItemList table tbody.dayLabel
{
	background-color: #FAFAFA;
}

div.calItemList table tr.firstRow
{
	line-height: 28px;
}

div.calItemList table tr.lastRow
{
	line-height: 20px;
}

div.calItemList table tr td
{
	padding-left: 5px;
	padding-right: 5px;
}

div.calItemList table tr td.column1
{
	width: 75px;
	padding-left: 0px;
	padding-right: 0px;
}

div.calItemList table tr td.column2
{
	width: 30%; /* of remaining width */
}

div.calItemList table tr td.column3
{
	width: 56%; /* of remaining width */
}

div.calItemList table tr td.column4
{
	width: 14%; /* of remaining width */	
}

div.calItemList table tr td.column5
{
	width: 46px; /* 14px (chevron img width) + 16px (L.padding) + 16px (R.padding) */
	text-align: center;
}

div.calItemList table tr td.itemMisc
{
	font-size: smaller;
	color: #999;
}

div.calItemList table tbody.dayLabel tr td
{
	font-weight: bold;
	font-size: 16px;
	color: #949494;
	border-color: #FAFAFA;
	line-height: 30px;
}

/*-----------------------------------------------------------------------*/
/* Navigation bar in Calendar context (Today, Next, Prev, Date Picker etc*/
/*-----------------------------------------------------------------------*/
div.calNavBar
{
	border-bottom: 1px solid #E3E3E3;
}

div.calNavBar table
{
	-webkit-box-shadow: rgba(0, 0, 0, 0.292969) 0px 2px 3px inset, rgba(0, 0, 0, 0.292969) 0px 2px 3px;
	background-color: #EDEDED;
}

div.calNavBar table td.middle
{
	width: 50%;
}

/*-----------------------------------------------------------------------*/
/* Calendar information button											 */
/*-----------------------------------------------------------------------*/
/* The child span nodes: .circle and .calName */
span.calCircle span
{
	vertical-align: middle;
}

/* Circle with gradient background reflecting the cal color */
span.circle
{
	display:inline-block;
	width: 16px;
	height: 16px;
	-webkit-border-radius: 8px;
}

span.circle img
{
	vertical-align: top;
}

/* Calendar name text */
span.calCircle span.calName
{
	padding: 0px 0px 0px 8px;
	font-size: 13px;
}

/***********************************************************************
* Item View Panel
************************************************************************/
.itemViewPanel
{
	overflow: hidden;
}

.itemView
{
	padding: 10px;
}

.itemViewFullSize
{
    position: fixed;
    left: 0;
    top: 0;
    z-index: -1;
}

.itemViewPanel .centerDiv
{
	margin-top: 0px !important; /* override from centerDiv */
	margin-bottom: 0px !important; /* override from centerDiv */
	height: 100%;
	background-color: White;
}

.itemViewNoItems
{
	padding-top: 20px; /* should match margin-top of div.centerDiv */
}

.itemViewTabPanel
{
	margin: 0px;
	padding: 0px 0px 5px 0px;
	list-style: none;
}

.itemViewTab, .itemViewTabSelected
{
	font-size: 14px;
	margin-right: 7px;
	display: inline;
}

.itemViewTab span
{
	color: #949494;
	font-weight: bold;
	background-color: #FAFAFA;
	padding: 5px 8px;
	-webkit-border-radius: 3px;
}

.itemViewTabSelected
{
	color: #65929E;
	font-weight: bold;
	background-color: white;
	padding: 5px 8px 10px;
	-webkit-border-top-left-radius: 3px;
	-webkit-border-top-right-radius: 3px;
	-webkit-box-shadow: white 0px 5px 0px, rgba(0, 0, 0, 0.199219) 1px 1px 3px;
}

.itemViewContentPanel, .itemViewPropertiesPanel
{
	margin: 6px 0 0;
	padding: 13px;
	background-color: white;
	-webkit-border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	-webkit-box-shadow: rgba(0, 0, 0, 0.199219) 1px 1px 3px;
}

.itemViewPropertiesPanel
{
	text-align: center;
	-webkit-border-top-left-radius: 4px;
}

.itemViewSubject, .itemViewSubjectHighPriority, .itemViewSubjectLowPriority
{
	font-weight: bold;
	font-size: 18px;
	word-wrap: break-word;
}

.itemViewSubjectHighPriority
{
	color: red;
}

.itemViewSubjectLowPriority
{
	color: rgb(148, 148, 148);
}

.itemViewSecurityRRContainer
{
	padding-bottom: 8px;
	font-size: 14px;
}

.itemViewSecurityRRLabel
{
	font-weight: bold;
	margin-right: 5px;
}

.itemViewSectionBottomMargin
{
	padding-bottom: 10px;
}

.itemViewHeaderLabel
{
	font-size: 13px;
	font-weight: bold;
	color: #B8B8B8;
	margin-right: 5px;
}

.itemViewHeaderText, .itemViewTimeAgo
{
	color: #B8B8B8;
	font-size: 13px;
}

.itemViewTaskCompleted
{
	white-space: nowrap;
	float: right;
	margin-right: 5px;
}

.itemViewTaskCompletedText
{
	font-size: 14px;
	vertical-align: text-top;
	padding-left: 5px;
	padding-bottom: 3px;
}

.itemViewDetailsLink, .itemViewAttachmentDetailsLink, .itemViewEmbeddedAttachmentLink
{
	color: blue;
	cursor: pointer;
}

.itemViewDetailsLink
{
	margin-left: 10px;
	white-space: nowrap;
	float: right;
}

.itemViewAttachmentDetailsLinkSelected
{
	color: red;
	cursor: pointer;
}

.itemViewTimeAgo
{
	margin-left: 10px;
	white-space: nowrap;
	float: right;
	cursor: pointer;
}

.itemViewCalendarBox
{
	float: right;
	margin: 0 5px;
	max-width: 200px;	
}

.itemViewCalendarBox span.calCircle
{
	padding-left: 5px !important;
	padding-right: 5px !important;
}

.itemViewShowAsBox
{
	margin: 2px;
}

.itemViewAttachments
{
	padding-left: 50px;
}

.itemViewAttachmentLink, .itemViewEmbeddedAttachmentLink
{
	font-size: 14px;
	padding-top: 7px;
}

div.itemViewAttachmentLink a
{
	text-decoration: none;
}

div.itemViewAttachmentLink a.viewLink
{
	margin: 0px 20px;
}

div.itemViewEmbeddedAttachmentLink img
{
	margin-right: 5px;
	vertical-align: bottom;
}

.itemViewEditDraftBtn
{
	color: red;
}

.itemViewChildBackgroundColor
{
	background-color: #ffffe0;
}

.itemViewShowHtmlImages
{
	text-align: center;
	padding: 6px;
	background-color: #F5C04D;
	color: #1F1F1F;
	border-radius: 4px;
}

.itemViewTapToOpen
{
	text-align: center;
	padding: 6px;
	background-color: #EEE;
	color: #65929E;
	border-radius: 4px;
	margin-top: 20px;
}

.itemViewMessageDiv
{
	padding: 5px 0 10px;
}

.itemViewLargePlainMsg
{
	padding: 0;
	border-style: none;
	-webkit-appearance: none;
	width: 100%;
	font-size: 16px;
}

/***********************************************************************
* Styles for modal dialogs and views
************************************************************************/
.overlayViews
{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	/*background-color: black;
	opacity: 0.3;*/
	z-index: 500;
	background-repeat:no-repeat;
	background-position:center;
	background-color: rgba(0, 0, 0, 0.3);
}

.dialogParent
{
	position: absolute;
	top: 0px;
	width: 100%;
	height: 100%;
}

.aboutDialog, .composeDialog, .moveDialog, .smallDialog
{
	position: relative;
	color: black;
	z-index: 510;
	top: 34px;
	margin: 0 auto;
}

.aboutDialog
{
	-webkit-border-radius: 3px !important;
}

.moveDialog
{
	background-color: white;
	overflow:hidden;
	-webkit-border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
}

.moveTree
{
	height: 90% !important; /* Override height set by .smallDlgBd */
}

.moveTree div.idMoveDialogBdWrapper
{
	height: 100%;
}

.aboutDialog .smallDlgBdContents
{
	padding: 0px !important;
	background: inherit;
	height: auto !important;
}

/* Branding Images container in About dialog */
.aboutDialog .brandingImgContainer
{
	margin: 0px 20px;
}

.aboutDialog .brandingImgContainer img.rightFloat
{
	float: right;
}

/* Version container in About dialog */
.aboutDialog .versionContainer
{
	margin: 14px 40px;
}

.aboutDialog .infoContainer
{
	margin: 14px 10px;
}

.aboutDialog .infoContainer table
{
	table-layout: fixed;
	width: 100%;
}

.aboutDialog td
{
	font-size: 12px;
	vertical-align: top;
}

.aboutDialogLabel
{
	color: #FFFFFF;
	text-align: right;
/*	white-space: nowrap;	*/
	width: 40%;
}

.aboutDialogData
{
	word-wrap: break-word;
}

.smallDlgBdComment
{
	border: 1px solid Gray;
	width: 100%;
	padding: 0;
	font-size: 16px;
}

.smallDlgBdContents
{
	padding: 10px;
}

.propertiesHeader
{
    text-align: left;
    font-size: 16px;
    font-weight: bold;
    -webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
    border: 1px solid #EDEDED;
    color: #505354;
    padding-bottom: 4px;
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 5px;
	margin-bottom: 1px;
}

.propertiesHeaderBottom
{
	-webkit-border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
}

.propertiesHeaderOtherThanFirst
{
	margin-top: 15px;
}

.propertiesSummary
{
	text-align: left;
    font-size: 12px;
    font-weight: normal;
    color: #505354;
    padding-bottom: 3px;
	padding-top: 3px;
	padding-left: 20px;
	padding-right: 5px;
}

.propertiesSectionHeader
{
    text-align: left;
    font-size: 16px;
    font-weight: bold;
    border: 1px solid #EDEDED;
    color: #505354;
    background-color: #EDEDED;
    padding-bottom: 4px;
	padding-top: 5px;
	padding-left: 10px;
	padding-right: 5px;
	margin-bottom: 1px;
}

.propertiesSectionHeaderImage
{
	vertical-align:text-top;
}

.propertiesSectionLabel
{
	padding-left: 10px;
}

.propertiesSystemAttachmentColor
{
	color: #B8B8B8;
}

.propertiesSystemAttachmentSpacing
{
	padding-left: 0px;
}

.propertiesSection
{
    text-align: left;
    font-size: 12px;
    border: 1px solid #EDEDED;
    color: #505354;
    padding-bottom: 3px;
	padding-top: 3px;
	padding-left: 5px;
	padding-right: 0px;
	margin-bottom: 1px;
}

.propertiesGeneralSection
{
	border: 1px solid #EDEDED;
}

.propertiesLabel
{
    text-align: left;
    font-size: 12px;
    white-space: nowrap;
}

.propertiesExtraLabel
{
    text-align: left;
    font-size: 12px;
    white-space: nowrap;
    padding-bottom: 3px;
    padding-left: 5px;
    padding-top: 10px;
}

.propertiesTableCell
{
    text-align: left;
    color: #505354;
    font-size: 12px;
    padding-bottom: 0px;
	padding-top: 2px;
	padding-left: 5px;
	padding-right: 5px;
}

.propertiesTableOuterSizedCol
{
	width: 145px;
}

.propertiesTableSizedCol
{
	width: 20%;
}

.propertiesTableEmptyCol
{
	width: 15px;
}

.propertiesTableFileSizeCol
{
	width: 17%;
}

.propertiesTableSendOptionsCol
{
	width: 23%;
}

.recipientsTableCell
{
    text-align: left;
    color: #505354;
    font-size: 16px;
    padding-bottom: 0px;
	padding-top: 2px;
	padding-left: 5px;
	padding-right: 5px;
}

.recipientsTableExpandImageCell
{
	width: 28px;
}

.undeliverableRecipients
{
	background-color: #505354;
	color: white;
}

.propertiesExpandImage
{
	float: right;
	padding-right: 10px;
	overflow: hidden;
}

.propertiesTable
{
    width: 100%;
    table-layout: fixed;
}

.detailsTable
{
	margin-left: 10px;
    padding-left: 3px;
    border: 1px solid #E0E0E0;
    width: 96%;
    background-color: #FAFAFA;
    margin-bottom: 3px;
}

.acceptOptionsColorSquare
{
	width: 16px;
	height: 16px;
    border-radius: 1px;
    -moz-border-radius: 1px;
	-webkit-border-radius: 1px;
	border: 1px solid #949494;
	display: inline-block;
	margin-right: 3px;
}

.smallDlgLabel
{
	padding-right: 10px;
	white-space: nowrap;
}

.acceptOptionsCell
{
	padding-bottom: 10px;
}

.acceptOptionsSelect
{
	width: 100%;
	padding: 3px 0;
	font-size: 14px;
}

.acceptOptionsTable
{
	table-layout: fixed;
}

.acceptOptionsTentativeImg
{
	padding-bottom: 5px;
}

.composeDlgBd, .smallDlgBd
{
	background-color: white;
	height: 480px;
	overflow: hidden;
}

.composeDlgBd .composeDlgBdWrapper, .composeDlgBd .composeDlgBdWrapper #idSendForm
{
	height: 100%;
	overflow: auto;
}

.smallDlgBd
{
	-webkit-border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
}

.composeDlgBdRow
{
	border-bottom: 1px dotted gray;
	padding: 10px;
}

.composeDlgBdMsg
{
	padding: 10px;
	-webkit-box-sizing: border-box;
	position: relative;
}

.composeDlgMsgInput
{
	border-style: none;
	-webkit-appearance: none;
	-webkit-box-sizing: border-box;
	font-size: 16px;
	min-height: 192px;
	width: 100%;
}

.composeDlgInputLabel, .composeDlgCCBCLabel, .composeDlgInputInnerLabel, .nccLabel
{
	padding-top: 3px;
	padding-right: 8px;
}

.composeDlgInputText
{
	font-size: 16px;
}

.composeDlgInputLabel, .composeDlgInputInnerLabel, .nccLabel
{
	color: gray;
}

.composeDlgCCBCLabel
{
	color: blue;
}

.composeDlgInputInnerLabel
{
	padding-left: 10px;
}

.composeDlgAllDayEventLabel
{
	margin-right: 30px;
}

.composeDlgFt
{
	background-image: -webkit-gradient(linear, left bottom, left top, from(#fff), to(rgb(167, 171, 184)));
	-webkit-border-bottom-left-radius: 4px;
	-webkit-border-bottom-right-radius: 4px;
}

.captionTitleOverride
{
	padding: 5px;
	font-size: 16pt;
	font-weight: bold;
	text-align: center;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ui-widget
{
	font-size: 11px;
}

.gw-msg-icon
{
	display: block;
	float: left;
	overflow: hidden;
}

.folderPropsBd
{
	background-color: white;
	padding: 10px;
}

.folderPropsLabel
{
	color: gray;
	text-align: right;
	vertical-align: text-top;
}

.folderPropsData
{
	padding-bottom: 5px;
}

.retractOptionsDiv
{
	margin-top: 5px;
	margin-bottom: 15px;
	margin-left: 5px;
	margin-right: 0;
}

.retractOptionContainer
{
	margin: 0 5px 10px;
}

.retractOptionLabel
{
	padding: 0 5px;
}

/**************************************************************
* Send Options Styles
***************************************************************/
.sendOptionContainer
{
	margin: 0 5px 10px;
}

.sendOptionLabel
{
	padding: 0 5px;
}

.sendOptionSelectControl
{
	font-size: 14px;
}

.sendOptionReturnNotification
{
	margin-left: 10px;
}

.sendOptionReturnNotificationInput
{
	margin-left: 50px;
}

/**************************************************************
* Name Completion Styles:
***************************************************************/
.nccResultsContainer
{
	background-color: #FFFFFF;
	border: 2px gray solid;
	position: absolute;
	visibility: hidden;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	vertical-align: middle;
	z-index: 1000;
	padding: 4px; /*-webkit-box-shadow: 3px 3px 3px #dadada;*/	
}

.nccItemInList
{
	border-bottom: 1px #cacaca solid;
	border-top: 1px #cacaca solid;
	height: 22px;
	position: relative;
	padding-bottom: 2px;
	padding-top: 5px;
	padding-left: 25px;
	margin: -1px;
	vertical-align: middle;
}

.nccABHeader
{
	height: 22px;
	position: relative;
	padding-bottom: 5px;
	padding-top: 7px;
	vertical-align: middle;
	font-weight: bold;
	color: gray;
}

.nccItemInListSelected
{
	background-color: #eaeaea;
	border: 3px white solid;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	height: 22px;
	position: relative;
	padding-bottom: 2px;
	padding-top: 5px;
	padding-left: 25px;
	margin: -1px;
	vertical-align: middle;
}

.nccItemName
{
	vertical-align: middle;
	text-align: left;
	font-size: 16px;
	padding-bottom: 3px;
	padding-left: 8px;
	color: #404040;
	overflow: hidden;
	text-overflow: ellipsis;
	display: inline-block;
	max-width: 45%;
}

.nccItemIcon
{
	/*background-color: #ccc;
		border-top: 1px gray solid;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		vertical-align: middle;*/
}

.nccItemEmail
{
	height: 22px;
	vertical-align: middle;
	font-size: 12px;
	font-style: italic;
	margin-left: 10px;
	color: gray;
	overflow: hidden;
	text-overflow: ellipsis;
	display: inline-block;
	max-width: 45%;
}

.nccAddedItem
{
	margin-right: 4px;
	border: 1px white solid;
	vertical-align: middle;
	display: inline-block;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	padding-bottom: 3px;
}

.nccAddedItemSelected
{
	background-color: #bffffb;
	border: 1px white solid;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	margin-right: 4px;
	vertical-align: middle;
	padding-bottom: 3px;
	overflow: hidden;
	display: inline-block;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.nccAddedItemNames
{
	height: 22px;
	margin: 2px;
	vertical-align: middle;
}

.nccAddedItemInfo
{
	background-color: white;
	border: 2px gray solid;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	padding: 4px;
	position: absolute;
	vertical-align: middle;
	visibility: hidden;
	z-index: 1000; /*-webkit-box-shadow: 3px 3px 3px #dadada;*/
	top: 0px;
}

.nccNameInfo
{
	font-size: 16px;
	font-weight: bold;
}

.nccEmailInfo
{
	font-size: 12px;
	font-style: italic;
	color: gray;
}

.addressesDiv
{
	display: block;
	vertical-align: middle;
}

.nccTextbox
{
	-webkit-appearance: none;
	border: 0px solid transparent;
	font-size: 14px;
	width: 98%;
	-webkit-rtl-ordering: logical;
	-webkit-user-select: text;
}

.nccInfoButton
{
	margin-top: 7px;
}

.contactSearchButton
{
	padding-top: 3px;
	margin-right: 5px;
	-webkit-box-flex: 0;
	display: block;
}

.partialFoundResult
{
	/*background: #FFFF00;
		border: 1px solid #ccc;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;*/
	font-weight: bolder;
	color: black;
}

/**************************************************************
* Popup Menu Styles:
***************************************************************/
.menuContainer
{
	-webkit-box-shadow: rgba(0, 0, 0, 0.398438) 0px 0px 15px;
	-webkit-border-radius: 7px;
	border: 1px solid #4f4f4f;
	right: 9px;
	top: 40px;
	position: absolute;
	vertical-align: middle;
	visibility:hidden;
	width:300px;
	z-index: 3000;
}

.menuContainerBorder
{
	background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#8DA8AD), color-stop(0.1, #263942), color-stop(0.1, #122730), color-stop(0.5, #122730), to(#112730));
	-webkit-border-radius: 6px;
	border-bottom: 1px solid rgba(0, 0, 0, 0.7);
	border-left: 1px solid rgba(255, 255, 255, 0.5);
	border-right: 1px solid rgba(0, 0, 0, 0.5);
	border-top: 1px solid rgba(255, 255, 255, 0.7);
	position: relative;
	padding: 5px;
}

.menuContainerContent
{
	-webkit-border-radius: 5px;
	border: 1px solid #4f4f4f;
	padding: 0px;
	height: 100%;
	overflow: auto;
	background-color: White !important;
}

.menuContainerContentList
{
	-webkit-box-shadow: rgba(0, 0, 0, 0.199219) 0px 0px 5px inset;
	-webkit-border-radius: 4px;
	list-style: none outside none;
	margin: 0px;
	padding: 0px;
}

.menuArrow
{
	position: absolute;
	visibility: hidden;
	z-index: 4000;
	background-color: transparent;
	border: none;
	height: 18px;
	width: 35px;
}

.menuArrowUp
{
	background-image: url( '../../images/mobile2.png' );
	background-repeat: no-repeat;
	background-position: -210px -38px;
}

.menuArrowDown
{
	background-image: url( '../../images/mobile2.png' );
	background-repeat: no-repeat;
	background-position: -210px -68px;
}

.menuItem
{
	border-top: 1px solid rgba(79, 79, 79, 0);
	border-bottom: 1px solid #D1D1D1;
	color: #383838;
	font-family: helvetica;
	font-size: 20px;
	font-weight: bold;
	height: 50px;
	line-height: 50px;
	margin: 0px;
	padding: 0px 17px 0px 17px;
	position: relative;
	vertical-align: middle;
}

.menuItem:first-child
{
	border-top-color: #D1D1D1;
}

.menuItemLabel
{
	/*font-weight: bold;*/
}

.menuItemCheckbox
{
	margin: 0px 8px 0px 0px;
}

.menuItemIcon
{
	/*display: block;*/
}

.menuItemIconBGDiv
{
	height: 16px;
	width: 16px;
	margin: 0px 8px;
	display: inline-block;
}

.menuItemCalCircleBGSpan
{
	margin: 0px 8px;
}

.menuAccordionContent
{
	position: relative;
	padding-bottom: 5px;
	padding-top: 5px;
	padding-left: 17px;
	padding-right: 5px;
	vertical-align: middle;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	display: none;
	font-family: helvetica;
	font-size: 18px;
	border-top: 1px solid #D1D1D1;
	color: #505354;
}

.accordionMenuArrow
{
	border: none;
	float: right;
}

/***********************************************************************
* Find Workspace
************************************************************************/
div#idFindItemListPanel
{
	
}

#idFindForm table.queryTextTable
{
	margin-left: 7%;
	width: 85%;
	padding: 0px;
	border-spacing:0px;
	height: 30px;
}

#idFindForm table td.queryTextLeft
{
	width: 20px;
	padding: 0px;
	-webkit-border-top-left-radius: 15px;
	-webkit-border-bottom-left-radius: 15px;
	border-left: 1px solid #AAA;
	border-top: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	background: #FFF url('../../images/srch.png') no-repeat 3px 5px;
}

#idFindForm table td.queryTextMiddle
{
	padding: 0px;
	border-top: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	background-color: rgb(255, 255, 255);
}

#idFindForm table td.queryTextRight
{
	width: 20px;
	padding: 0px;
	-webkit-border-top-right-radius: 15px;
	-webkit-border-bottom-right-radius: 15px;
	border-top: 1px solid #AAA;
	border-right: 1px solid #AAA;
	border-bottom: 1px solid #AAA;
	background-color: rgb(255, 255, 255);
}

.clearButton
{
	background: #FFF url('../../images/clear.png') no-repeat 0px 5px;
}

#idFindForm input.queryTextField
{
	width: 100%;
	padding: 0px;
	border: none;
	margin: 0px;
	font-size: 14px;
	-webkit-appearance: none;
}

#idButtonFind
{
	float: right;
}

#idShowOptsLink, #idHideOptsLink
{
	font-size: 12px;
	color: blue;
	cursor: pointer;
	text-decoration: none;
}

#idFindOptionsContainer, #idSimpleFindContainer
{
	margin-left: 25px;
	margin-right: 25px;
}

#idFindOptionsContainer div.optionName
{
	color: gray;
	padding-bottom: 2px;
	border-bottom: 1px dotted gray;
	margin-bottom: 8px;
}

#idFindOptionsContainer div.optionValue
{
	padding: 5px 0px 5px 20px
}

#idFindOptionsContainer div.optionValue table.optionDateRangeValues
{
	margin-left: 17px;
}

#idFindOptionsContainer div.optionValue table.optionDateRangeValues td.fieldName
{
	text-align: right;
}

div.divFindDate
{
	width:115px;
	border: 1px solid rgb(204, 204, 204);
	white-space: nowrap;
	padding: 5px;
	-webkit-border-radius: 5px;
}

input.findDate
{
	width:90px;
	vertical-align: middle;
	-webkit-appearance: none;
	border: none;
	margin: 0px;
	padding: 0px 5px 5px 0px;
	font-size: 14px;
}

div.divFindDate img
{
	vertical-align: middle;
}

#idFindListLoadingMsg
{
	text-align: center;
	width: 100px;
	margin-left: auto;
	margin-right: auto;
}

#idFindViewLoadingMsg
{
	text-align: center;
	width: 40px;
	margin-left: auto;
	margin-right: auto;
}

/*---------------------------------------------------*/
/* Inline tabs using <span>							 */
/*---------------------------------------------------*/
span.inlineTabs span
{
	margin-left: 0px !important;
	margin-right: 0px !important;
}

span.inlineTabs span.splitButtons
{
	margin-left: 4px !important;
	margin-right: 4px !important;
}

span.inlineTabs span.noRoundBorderLeft
{
	border-top-left-radius: 0px !important;
	border-bottom-left-radius: 0px !important;
}

span.inlineTabs span.noRoundBorderRight
{
	border-top-right-radius: 0px !important;
	border-bottom-right-radius: 0px !important;
}

span.inlineTabs span.selected
{
	-webkit-box-shadow: rgba(255, 255, 255, 0.898438) 0px 0px 2px; 
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#C6C6C6), color-stop(0.04, #F2F2F2), color-stop(0.08, white), color-stop(0.96, white), to(#E9E9E9));
	border: 1px solid #5C8A99;
}

/***********************************************************************
* Common styles which needs to be at the end of the file for Safari
************************************************************************/
.selectedNode
{
	background-color: #9DE1E3 !important; /* Search for dependency before changing color */
}

.chevron
{
	width: 30px;
}

.chevronImg
{
	vertical-align: middle;
}

.heightZero
{
	height: 0px !important;
}

.paddingZero
{
	padding: 0 !important;
}

/***********************************************************************
* Attachments upload on Android tablets
************************************************************************/
/* Hidden input[type="file"] to open the file system browser */
.buttonInputFile
{
	opacity: 0;
	position: absolute;
	width: 22px;
	overflow: hidden; /* Defaults to "Choose File" width */
}

div.composeDlgAttachmentsWrapper
{
	max-height: 72px; /* Fits 3 Rows of attachments (3 * 24px) */
	overflow: auto;
	display: block;
	padding-right: 8px;
}

div.composeDlgAttachmentsWrapper div.progressWrapper
{
	margin-top: 0px !important; /* For horz alignment with the Attachments Label */
}

/* For horz alignment with span.attachmentRight */
div.composeDlgAttachmentsWrapper div.progressWrapper span.attachmentLeft
{
	padding: 0px 2px;
	height: 22px;
}

/* For horz alignment with span.attachmentLeft */
div.composeDlgAttachmentsWrapper div.progressWrapper span.attachmentRight 
{
	padding-top: 0px !important;
	padding-bottom: 0px !important;
}

/* For horz alignment with a.progressLinkView */
div.composeDlgAttachmentsWrapper div.progressWrapper a.attachmentMiddle
{
	height: 22px;
}

/* For horz alignment with div.progressCancel */
div.composeDlgAttachmentsWrapper div.progressWrapper span.attachmentLeft a.progressLinkView
{
	margin-top: 4px;
}

/* For horz alignment with a.progressLinkView */
div.composeDlgAttachmentsWrapper div.progressWrapper span.attachmentRight div.progressCancel
{
	margin-top: 0px !important;
	margin-bottom: 0px !important;
	padding-bottom: 1px; /* For tablets */
}

/*
div.composeDlgAttachmentsWrapper div.progressWrapper span.attachmentRight div.progressCancel img
{
	width: 16px;
	background-image: url( '../../images/mobile1.png' ) !important;
	background-repeat: no-repeat;
	background-position: -16px -16px !important;
}
*/

div.composeDlgAttachmentsWrapper div.progressWrapper a.attachmentMiddle
{
	padding-top: 0px !important;
}

form.attachFormClass
{
	display: inline;
}