﻿/* SharedControls.css
 *
 * Contains named or id-specific classes for shared controls such as
 * the tab control, toolbars, etc.
 *
 * Notes:
 *     - Please use em for font-sizes instead of px.
 *       For more info, go to http://www.bigbaer.com/css_tutorials/css_font_size.htm
 *     - Order is important, when a class is redefined later in the page the last
 *       settings when
 *
 */
/********************************************************************************************************************
 ********************************************************************************************************************
 ****   AJAXCONTROLTOOLKIT CALENDAR POPUP CONTROL CLASSES
 ****   - Begin -
 ********************************************************************************************************************
 ********************************************************************************************************************/
.ajax__calendar_container {padding:4px;position:absolute;cursor:default;width:170px;font-size:11px;text-align:center;font-family:tahoma,verdana,helvetica;}
.ajax__calendar_body {height:139px;width:170px;position:relative;overflow:hidden;margin:auto;}
.ajax__calendar_days, .ajax__calendar_months, .ajax__calendar_years {top:0px;left:0px;height:139px;width:170px;position:absolute;text-align:center;margin:auto;}
.ajax__calendar_container TABLE {font-size:11px;}
.ajax__calendar_header {height:20px;width:100%;}
.ajax__calendar_prev {cursor:pointer;width:15px;height:15px;float:left;background-repeat:no-repeat;background-position:50% 50%;background-image:url(WebResource.axd?d=M9s1Gv_1_A2TwJG0H8NSZFY4FTh4qL2phWI02RoBbB0m7PrgXPti7-X4DcjqYs7D6OlJXOLvjudXZlvEHT8-rA2&t=633186502236636071);}
.ajax__calendar_next {cursor:pointer;width:15px;height:15px;float:right;background-repeat:no-repeat;background-position:50% 50%;background-image:url(WebResource.axd?d=M9s1Gv_1_A2TwJG0H8NSZFY4FTh4qL2phWI02RoBbB0m7PrgXPti7-X4DcjqYs7DDWXSbpk2a_pZjRBjJWt5NQ2&t=633186502236636071);}
.ajax__calendar_title {cursor:pointer;font-weight:bold;}
.ajax__calendar_footer {height:15px;}
.ajax__calendar_today {cursor:pointer;padding-top:3px;}
.ajax__calendar_dayname {height:17px;width:17px;text-align:right;padding:0 2px;}
.ajax__calendar_day {height:17px;width:18px;text-align:right;padding:0 2px;cursor:pointer;}
.ajax__calendar_month {height:44px;width:40px;text-align:center;cursor:pointer;overflow:hidden;}
.ajax__calendar_year {height:44px;width:40px;text-align:center;cursor:pointer;overflow:hidden;}

.ajax__calendar .ajax__calendar_container {border:1px solid #646464;background-color:#ffffff;color:#000000;}
.ajax__calendar .ajax__calendar_footer {border-top:1px solid #f5f5f5;}
.ajax__calendar .ajax__calendar_dayname {border-bottom:1px solid #f5f5f5;}
.ajax__calendar .ajax__calendar_day {border:1px solid #ffffff;}
.ajax__calendar .ajax__calendar_month {border:1px solid #ffffff;}
.ajax__calendar .ajax__calendar_year {border:1px solid #ffffff;}

.ajax__calendar .ajax__calendar_active .ajax__calendar_day {background-color:#edf9ff;border-color:#0066cc;color:#0066cc;}
.ajax__calendar .ajax__calendar_active .ajax__calendar_month {background-color:#edf9ff;border-color:#0066cc;color:#0066cc;}
.ajax__calendar .ajax__calendar_active .ajax__calendar_year {background-color:#edf9ff;border-color:#0066cc;color:#0066cc;}

.ajax__calendar .ajax__calendar_other .ajax__calendar_day {background-color:#ffffff;border-color:#ffffff;color:#646464;}
.ajax__calendar .ajax__calendar_other .ajax__calendar_year {background-color:#ffffff;border-color:#ffffff;color:#646464;}

.ajax__calendar .ajax__calendar_hover .ajax__calendar_day {background-color:#edf9ff;border-color:#daf2fc;color:#0066cc;}
.ajax__calendar .ajax__calendar_hover .ajax__calendar_month {background-color:#edf9ff;border-color:#daf2fc;color:#0066cc;}
.ajax__calendar .ajax__calendar_hover .ajax__calendar_year {background-color:#edf9ff;border-color:#daf2fc;color:#0066cc;}

.ajax__calendar .ajax__calendar_hover .ajax__calendar_title {color:#0066cc;}
.ajax__calendar .ajax__calendar_hover .ajax__calendar_today {color:#0066cc;}
/********************************************************************************************************************
 ********************************************************************************************************************
 ****   AJAXCONTROLTOOLKIT CALENDAR POPUP CONTROL CLASSES
 ****   - End -
 ********************************************************************************************************************
 ********************************************************************************************************************/

/********************************************************************************************************************
 ********************************************************************************************************************
 ****   COMMENT CONTROL CLASSES
 ****   - Begin -
 ********************************************************************************************************************
 ********************************************************************************************************************/
.CommentControl 
{
	width: 100%;
}

.CommentControl .AdditionalInfoPane
{
	background-color: White; 
	position: absolute; 
	visibility: hidden; 
	text-align: left;
	border: solid 2px #CCCCCC;
}
/*
.CommentControl .lselect
{
	padding: 4px;
    background-color:#DFE4E8; 
}

*/
.CommentControl .CommentControlTitle
{
	white-space: nowrap;
	float:left;
	padding-left: 5px;
    text-decoration: none;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

/* The link on the Comment Control for displaying the additional information
   - Reset the font size and give some space after title */
.CommentControl .AdditionalInfoLink,
.CommentControl .AdditionalInfoLink a,
.CommentControl .AdditionalInfoLink a:active,
.CommentControl .AdditionalInfoLink a:visited,
.CommentControl .AdditionalInfoLink a:hover,
{
	color: Black;
	font-size: 8pt;
	margin-left: 20px;
}

/* Give some padding for the content of the pane */
.CommentControl .AdditionalInfoPane table
{
	padding: 5px;
}
/********************************************************************************************************************
 ********************************************************************************************************************
 ****   COMMENT CONTROL CLASSES
 ****   - End -
 ********************************************************************************************************************
 ********************************************************************************************************************/

/********************************************************************************************************************
 ********************************************************************************************************************
 ****   MISCELLANEOUS CONTROL CLASSES
 ****   - Begin -
 ********************************************************************************************************************
 ********************************************************************************************************************/

/* Class: .FormErrorMsg
 * Descr: When displaying error messages, use this class
 * Example: Controls/Documentation/DocumentGeneration.ascx
 */
.FormErrorMsg {
	font-weight: bold;
    color: Red;
    font-family: Arial, Helvetica, sans-serif;
}      

/* Class: .ImageButtonIcon
 * Descr: Style used for LtiImageButton that consists of an icon only, alongside a control to which it applies.
 * Example: ENGS Interim Rent calculation button - see DynamicSectionHelper::CreateEngsInterimRentCalculator().
 */
.ImageButtonIcon 
{
	padding: 1px 1px 1px 1px;
	vertical-align: middle;
}

/* Class: .ImageButtonPlain, .ImageButtonPlainHov
 * Descr: Styles used for LtiImageButton Control
 * Example: App_Themes/CreditManager.skin
 */
.ImageButtonPlain,
.ImageButtonPlainHov 
{
    padding: 1px 3px 1px 3px;
	vertical-align: middle;
    cursor: pointer;
}
.ImageButtonPlain 
{
	text-decoration: none;
}
.ImageButtonPlainHov
{
	text-decoration: underline;
}

.LoadingText
{
	text-align: center;
	font-size: 12pt;	
}

/* Used by Controls/Menu/CenteredProgress.ascx */
#ProgressTable 
{
    background-color: Transparent;
    z-index: 100;
    font-size: 1.1em;
}

#ProgressTable img
{
    width: 120px;
    height: 21px;
}

/********************************************************************************************************************
 ********************************************************************************************************************
 ****   MISCELLANEOUS CONTROL CLASSES
 ****   - End -
 ********************************************************************************************************************
 ********************************************************************************************************************/

/********************************************************************************************************************
 ********************************************************************************************************************
 ****   POPUP DIALOG CLASSES
 ****   - Begin -
 ********************************************************************************************************************
 ********************************************************************************************************************/

.ModalDialog
{
	background-color: #ffffff;
	border-width: 3px;
	border-style: ridge;
	border-color: Gray;
	width: 700px;
	height: 400px;
	padding: 3px;
	overflow: hidden;
	padding: 0px 0px 0px 0px;
}
.CommentModalDialog
{
	background-color: #ffffff;
	border-width: 3px;
	border-style: ridge;
	border-color: Gray;
	width: 700px;
	height: 390px;
	padding: 3px;
	overflow: hidden;
	padding: 0px 0px 0px 0px;
}

/* DialogTitlebar gives the look of a windows form */
.Titlebar 
{
	height: 1.75em; /* 1 3/4 lines of text */
	width: 100%;
	border-collapse: collapse;
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType='1', startColorStr='#485673', endColorStr='#63769c'); /* IE 7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Gradient(gradientType='1', startColorStr='#485673', endColorStr='#63769c')"; /* IE 8-9 */
	background: -ms-linear-gradient(left, #485673, #63769c); /* IE 10 */
	color: white;
	font-size: 10pt;
}

.TitlebarText,
.TitlebarIcon
{
	float: left;
	padding: 2px;
	vertical-align: middle;
	height: 1.75em; /* 1 3/4 lines of text */
}

/* Adds space to the left/right of the icon */
.TitlebarIcon
{
	padding-left: 4px;
	padding-right: 4px;
}

/* Grays out the main page to make the popup stand out as a modal popup */
.ModalDialogShadedBackground
{
	background-color: Gray;
	filter: alpha(opacity=70);
	opacity: 0.7;
}

.TabHeader a,
.TabHeader a:visited,
.TabHeader a:active
{
	color: White;
}

.shortText{
	width: 75px;
}

/********************************************************************************************************************
 ********************************************************************************************************************
 ****   POPUP DIALOG CLASSES
 ****   - End -
 ********************************************************************************************************************
 ********************************************************************************************************************/

.size75
{
	width: 75px;
}

.size75
{
	width: 80px;
}

.size150
{
	width: 150px;
}

.size200
{
	width: 200px;
}

.size250
{
	width: 250px;
}

/* Class: .PageBackground
 * Descr: Pages that want the colored background should use this class
 * Example: MasterPages/PageWithScrolling.Master
 */
.PageBackground
{
	background-color: #ACC0E9;
}

/* Class: .AtlasPage
 * Descr: Styles used for body tags of Atlas-Enabled page
 * Example: MasterPages/AtlasPage.Master
 */
body.AtlasPage 
{
	overflow: hidden;
	margin: 0 0 0 0;
	background-color: #ACC0E9;
}

body.AtlasPageNoTabs
{
	margin: 0 0 0 0;
}

.TabHeader 
{
    padding-top: 5px;
    padding-left: 5px;
    padding-bottom: 5px;
    margin-bottom: 0px;
    background-color: #63769B; 
}
.TabHeader span 
{
	font-weight: bold;
    color: White; 
    text-transform:none;
    font-size: 10pt;
}

.SectionHeader
{
    background-color:#DFE4E8; 
}

.SectionHeader .title
{
    font-size: 9pt;
    text-decoration: none;
    margin-bottom: 0px;
    padding-bottom: 0px;
}

SectionHeader .normal
{
    float: right;
}

.SubSectionHeader
{
    font-weight: bold;
    color: White;
    text-transform: none;
    font-size: 9pt;
    background-color: #5D7B9D;
    font-family: arial, Helvetica, sans-serif;
}

.SubSectionHeaderNew
{
    font-weight: bold;
    color: #FFCC00;
    text-transform: none;
    font-size: 9pt;
    background-color: #5D7B9D;
    font-family: arial, Helvetica, sans-serif;
}
/********************************************************************************************************************
 ********************************************************************************************************************
 ****   LTI TABSET CLASSES
 ****   - Begin -
 ********************************************************************************************************************
 ********************************************************************************************************************/

/* Colors:
   Selected Tab BG: #EEF0F6
   Page BG: #ACC0E9
   Tab Label Border: #6489D4
 */
/* Tabset */
.Tabset 
{
	overflow-x: hidden; 
	float:left;
}

.Tabset ul {
 border-left: none;
 display: block;
 margin: 0;
 padding: 0;
 text-align: left;
 margin-top:1px;
 width: 100%;
 /* width: 600px; */
}


.Tabset li {
 background-color: white;
 border-top: solid 1px #6489D4;
 border-right: solid 1px #6489D4;
 border-left: solid 1px #6489D4;
 border-bottom: none;
 cursor: pointer;
 display: block;
 float: left;
 list-style: none;
 
 margin: 1px;
 margin-top: 2px;
 padding-top: 4px;
 padding-bottom: 5px;
 padding-left: 5px;
 padding-right: 5px;
 
 position: relative;
/*  width: 100px; */
 z-index: 97;
 white-space:nowrap;
 left: 4px;
}

.Tabset li:first-child {
 border-left: solid 1px #6489D4;
}

.Tabset li.selected 
{
	margin-top: 2px;
	margin-bottom: 0px;
	padding-top: 4px;
	padding-bottom: 6px;
	background-color: #EEF0F6;
	border-top: none;
	background-image: url(../Images/tab_selected_30.gif);
	background-repeat: repeat-x;
	/*background-color: white; */
	border-bottom: none;
	position: relative;
	z-index: 100;
}

.Tabset .pane 
{
	background-color: #EEF0F6;
	border: solid 1px #6489D4;
	clear: both;
	overflow: auto;
	/* overflow-x: hidden;*/
	padding: 5px;
	position: relative;
	z-index: 99;
	display: none;
	left: 5px;
	
	/* intial width, to be set by JavaScript during pageLoad() */
	/* width: 400px; */
}

/********************************************************************************************************************
 ********************************************************************************************************************
 ****   LTI TABSET CLASSES
 ****   - End -
 ********************************************************************************************************************
 ********************************************************************************************************************/


/********************************************************************************************************************
 ********************************************************************************************************************
 ****   LTI TOOLBAR CLASSES
 ****   - Begin -
 ********************************************************************************************************************
 ********************************************************************************************************************/

/* Class: .Toolbar
 * Descr: Style used for the outer Div tag that makes up the toolbar
 *   This controls the scroll bar if the toolbar is too big for the screen
 *   and also the background color (or image)
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar
{
	/* The height is only used initially until resize JScript runs */
	height: 30px;	
	width: 100%; 
	overflow-x: auto; 
	overflow-y: hidden;
	filter: progid:DXImageTransform.Microsoft.Gradient(gradientType='0', startColorStr='#dcdfe5', endColorStr='#bdc2cb'); /* IE 7 */
	-ms-filter: "progid:DXImageTransform.Microsoft.Gradient(gradientType='0', startColorStr='#dcdfe5', endColorStr='#bdc2cb')"; /* IE 8-9 */
	background: -ms-linear-gradient(top, #dcdfe5, #bdc2cb); /* IE 10 */
}

/* Class: .Toolbar Table
 * Descr: Style used for the table that contains all of the toolbar items
 *   Currently this just sets the width to 100%
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar Table
{
	width: 100%;
}
/* Class: .Toolbar .TopShadow
 * Descr: This is the empty Div tag immediately above the toolbar that gives
 *   the toolbar a 3D appearance by setting the top and bottom border.
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar .TopShadow
{
	border-top:1px solid #A8AEB5;
	border-bottom:1px solid #ffffff;
}

/* Class: .Toolbar .BottomShadow
 * Descr: This is the empty Div tag immediately below the toolbar that gives
 *   the toolbar a 3D appearance by setting the top and bottom border.
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar .BottomShadow
{
	border-top:1px solid #A8AEB5;
	border-bottom:1px solid #000000;
}

/* Class: .Toolbar .toolbarTextBox
 * Descr: The class used to control the height and border of textboxes
 *   used within the toolbar.
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar .toolbarTextBox 
{
	height: 15px;
	border: 1px solid #7b9ebd;
}
/* Class: .Toolbar .toolbarLabel
 *        .Toolbar .toolbarButton,
 *        .Toolbar .toolbarButtonHover,
 *        .Toolbar .toolbarSpacer
 * Descr: The default settings for the various types of toolbar items
 *   such as a text label, a button, a button hover event and a spacer
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar .toolbarLabel, 
.Toolbar .toolbarButton,
.Toolbar .toolbarButtonHover,
.Toolbar .toolbarSpacer
{
	text-align: center;
    vertical-align: middle;
    white-space: nowrap;
    padding: 2px 2px 2px 2px;
}

/* Class: .Toolbar .toolbarButton
 * Descr: This puts some extra space at bottom of buttons.
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar .toolbarButton
{
    padding-bottom: 6px;
}

/* Class: .Toolbar .toolbarButtonHover,
 * Descr: This sets the effects for when a mouse is hovering over an 
 *   enabled button.
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar .toolbarButtonHover
{
    background-color: #edf1d5; /*orange #BBD0EA */
    border: 1px solid #485673;
    padding: 1px 1px 5px 1px;
    cursor: pointer;
}

/* Class: .Toolbar .toolbarLabel,
 *        .Toolbar .toolbarSpacer
 * Descr: This gives labels and spacers more distance on the left and right 
 *   sides before the next button.
 *
 * Example: Controls/Menu/MainToolbar.ascx
 */
.Toolbar .toolbarLabel,
.Toolbar .toolbarSpacer
{
    padding-left: 6px;
    padding-right: 2px;
}

/********************************************************************************************************************
 ********************************************************************************************************************
 ****   LTI TOOLBAR CLASSES
 ****   - End -
 ********************************************************************************************************************
 ********************************************************************************************************************/

/* Class" .Edit-Status-Label
 *
 * Descr: defines the look of the label for the edit status of a record.
 *
 * Example: Controls/Assets/Equipment.aspx
 */
.Edit-Status-Label {
	color: #000000;
	background-color: #FFFF99;
}

/* Class" .HeaderPanel
 *
 * Descr: this sets the area for a table row header.
 *
 * Example: Controls/FileUpload/FileUpload.ascx
 */
.HeaderPanel
{
	vertical-align: middle;
    color:#2A6BA3;
	background-color:#DFE4E8;
	font-weight: bold;
}

div#UserPreferences
{
    background-color: #f1eff2;
    font-size:1.0em;
}

div#UserPreferences .header
{
    background-color:#2f6bb3;
    font-size:1.2em;
    font-weight:bold;
    color:#FFFFFF;
}

div#UserPreferences .headerdesc
{
    background-color:#2f6bb3;
    font-size:0.9em;
    font-weight:normal;
    color:#FFFFFF;
}

div#UserPreferences .secbar
{
    font-size:1.1em;
    font-weight:bold;
    border-bottom-style:solid;
    border-bottom-color:#000000;
    border-bottom-width:thin;
}

div#UserPreferences .stdTable
{
    background-color:#f1eff2;
    margin: 10px 10px 10px 10px;
    border: solid thin #2f6bb3;
}

/**********************************************************
 * COMMON ALIGNMENT STYLES
 **********************************************************/
align_topleft 
{
    vertical-align: top;
    text-align: left;
}
align_topcenter
{
    vertical-align: top;
    text-align: center;
}
align_topright
{
    vertical-align: top;
    text-align: right;
}
