﻿/*--------------------------------------------------*/
/*  ca_department.css                               */
/*  Last updated 02/01/2016 by P. Lettington        */
/*  Based on Version 1.20, last updated 03/23/2007  */
/*  Department-specific styles                      */
/*--------------------------------------------------*/


/*------------------------------*/
/* GENERAL PAGE ELEMENTS        */
/*------------------------------*/
h1 {
 	font-family: Georgia, "Times New Roman", Times, serif;
 	font-weight: bold;
 	font-size: 1.38em;
 	border-bottom:2px dotted #999;
 	margin:14px 0;
 	width:99%; /* Fix IE problem, too short */
}

h2 {
 	font-size: 1.2em;
 	font-weight: bold;
 	margin-bottom: 6px;
}

h3 {
 	font-size: 1em;
 	font-weight: bold;
}

p {
	line-height:1.25em
}

hr {
 	color: #ccc;
 	background-color: #ccc;
 	height: 2px;
 	border: 0;
}

/*------------------------------*/
/* BRANDING & CONTACT           */
/*------------------------------*/

.PageBranding { 
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: bold; 
	font-size: 1em; 
	margin-bottom: -1em; 
} 

#PageInfo {
  	
  	border-top:2px dotted #999;
	margin:1em 0;
 	/* width:99%; Fix IE problem, too short */
  	font-size: .85em;
 	padding: 1em; 	
}

address { font-style: normal; }

/*------------------------------*/
/*HIGHLIGHT BOX                 */
/*------------------------------*/

.HighlightBox {
	border: 1px solid;
	border-radius: 5px;
	float: right;
	margin: 0 1em .5em .25em;
	width: 25%;
}

.HighlightBoxTitle {
	border-radius: 5px 5px 0 0;
	font-size: 1em;
	font-weight: bold;
	padding: .25em;
}

.HighlightBox a {
 	border-bottom: 1px dotted;
 	color: #000;
 	text-decoration: none;
}

.HighlightBox ul li {
 	font-size: .9em;
 	margin: .25em 1em 1em 1em;
}

.HighlightBox p {
 	font-size: .9em;
 	margin: 1em;
}

/*-----------------*/
/* LISTS           */
/*-----------------*/

/* Note: Tab Panel lists are in the Tab Panel section. */

.list_decorative_scheme li, #middle_column .list_decorative_scheme li {
 	list-style-image:url('/../images/CAStandard/ca_department/bullet_blue.gif');
 	padding:.1em;
 	margin-bottom:0;
}

.list_decorative_scheme a {
 	text-decoration:none;
 	display:block;
 	border-bottom:1px dotted;
}

.list_decorative_dark a:hover, a:focus, a:active .list_decorative_light a:hover, a:focus, a:active .list_decorative_scheme a:hover, a:focus, a:active .list_decorative_blue a:hover, a:focus, a:active {
 	text-decoration:none;
}

#middle_column ul li {
 	list-style-image: url('/../images/CAStandard/ca_department/bullet_blue.gif');
 	margin-bottom: .75em;
 	line-height:1.25em;
}

#middle_column li ul li{
 	list-style-image: url('/../images/CAStandard/ca_department/bullet_blue.gif');
 	margin-bottom: 5px;
 	line-height:1.25em;
}

#middle_column ul {
 	margin: 1em 0 1.2em 2em;
 	padding: 0 0 0 .4em;
}

#middle_column ol {
 	margin: 1em 0 1.2em 2em;
 	padding: 0 0 0 .4em;
}

#middle_column ul ul {
 	margin: 0 0 0 3em; 
 	padding: .2em 0 0 .4em;
}

#middle_column ul ol {
 	margin: 0 0 0 3em; 
 	padding: .2em 0 0 .4em;
}

#middle_column ol ol {
 	margin: 0 0 0 3em; 
 	padding: .2em 0 0 .4em;
}

#middle_column ol ul {
 	margin: 0 0 0 3em; 
 	padding: .2em 0 0 .4em;
}

#middle_column ol li {
 	margin-bottom: .75em;
 	line-height:1.25em;
}

#right_column ul {
 	margin: 1em 0 0 .5em;
 	padding: 0 0 0 .4em;
}

.TextyList { } /* Need to experiment with more space between items if they are verbose. */

/* Wrap Bullets 
-----------------------------------------*/
/* Keeps list of bullets lined up to the right of images instead of overlapping them. */

#middle_column .WrapBulletList .WrapBulletListImage {
    float: left;
    margin-right: .8em;
}

#middle_column .WrapBulletList ul {
    list-style-position: inside;
    margin-left: .3em;
    padding: 0;
}

/* Horizontal Lists 
-----------------------------------------*/

.Horizontal ul {
	display: inline;
 	list-style: none;
}

.HorizontalNavMenu  { font-weight: bold; }

.Horizontal li {	
	display: inline;
 	line-height: 1.1em;
	border-left: 1px solid #000;
	margin: 0 .5em 1em -.5em;
	padding: 0 .5em 0 .5em;
}

li.First { border-left: none; }

li p.Indent 	{ margin-left: .1em; }

/* Alternate Ordered Lists 
-----------------------------------------------*/

ol.LowerAlpha { list-style-type: lower-alpha; }
ol.UpperAlpha { list-style-type: upper-alpha; }
ol.LowerRoman { list-style-type: lower-roman; }
ol.UpperRoman { list-style-type: upper-roman; }

/* Definition List
------------------------------------------------*/

dl { }	

dt { font-weight: bold; }

dd { margin-bottom: .75em; }


dt.ShortDefs {
    float: left;
    clear: left;
    margin: 0 1em .5em 0;
  }

dt.ShortDefs:after {
    content: ":";
  }
  
dd.ShortDefs {
    padding: 0 0 0 10em 0;
  }

/*------------------------------*/
/* TEXT FORMATTING              */
/*------------------------------*/
.TempForReview	{ background-color: #ff0; }
.InlineHeading	{ font-weight: bold; display: inline; margin-right: .25em; font-size: 1em; }
p.InlineHeading	{ display: inline; font-weight: normal; display: inline; margin-right: 0;}
a.GlossaryLink:link, a.GlossaryLink:visited { 
	color: #396;
	text-decoration: none; 
	border-bottom:1px dotted; 
}

.FinePrint		{ font-size: .85em; }
.Warning, .Alert	{ color: #c03; font-weight: bold; }
.SeeRef			{ color: #c03; font-style: italic; }
.SeeAlsoRef		{ color: #396; font-style: italic; }
cite			{ font-style: italic; }
strong			{ font-weight: bold; }
em			{  }
ins			{ text-decoration: none; background-color: #cf9; }
del			{ text-decoration: line-through; }
.RegsNote	{ font-size: .9em; }
.RegsNote p:last-child { margin-left: 3em; }

abbr, acronym {
	border-bottom: 1px dotted #000;
	cursor: help;
}

blockquote 	{ margin-left: 3em; }
.ContactBlock 	{ margin-left: 3em; }
.ImageWithBorder	{ border: 1px solid; }
.ImageWithCaption p	{ font-size: .85em; margin-top: 0; margin-bottom: .25em; margin-left: .25em; }
small 		{ font-size: .8em; } /*Should not use*/


/*-----------------------------------------*/
/* ALIGNMENT, WIDTH, POSITION, LAYOUT, ETC.*/
/* FOR IMAGES, NUMBERS, TEXT, COLUMNS      */
/*-----------------------------------------*/

.Indent 	{ margin-left: 3em; }
.RightAlign 	{ text-align: right; padding-right: 1px; }
.LeftAlign 	{ text-align: left; }
.RightFloat 	{ float: right; clear: right; }
.LeftFloat 	{ float: left; }
img.LeftFloat, div.LeftFloat, iframe.LeftFloat	{ float: left; margin-right: 1em; margin-bottom: 1em; }
img.RightFloat, div.RightFloat, iframe.RightFloat	{ float: right; margin-bottom: 1em; margin-left: 1em; clear: right; }
.NumberAlign	{ text-align: right; padding-right: 1px; }
.FullWidth 	{ width: 100%; }
.HalfWidth	{ width: 50%; }
.ThirdWidth	{ width: 33%; }
.Hidden 	{ visibility: hidden; }
.NoWrap		{ white-space: nowrap; }

/*Two-column layout used to save space by putting two chunks of info (lists, etc.) next to each other in equal columns */

div.TwoColumnLeft {
 	float:left;
 	width:48%;
 	margin:0;
 	padding:0;
}

div.TwoColumnRight {
 	float:right;
 	width:48%;
 	padding:0;
 	margin:0;
}


/*----------------------------------------*/
/* STATIC HTML DATA TABLES                */
/*----------------------------------------*/
.DataTable {
	border: 1px solid ;
	border-collapse: collapse;
	margin-bottom: 1.5em;
}

.DataTable td, th {
	border: 1px solid #999;
	border-collapse:collapse;
	padding: .2em;
	width: auto;
}

.DataTable tfoot { 
	vertical-align: bottom;
	font-weight: bold;
}

.DataTable td {
	vertical-align: top;	
}

th, th.Column { 
	font-weight: bold;
	vertical-align: bottom;
	text-align: left;
	background-color: #ccc;
}

th.RowHeader  { 
	vertical-align: top;
	background-color: #eee;
	font-weight: bold;
}

caption {
	font-size: 1.1em;
	text-align: left;
	font-weight: bold;
	padding-bottom: .2em;
}

.TableFootnote {
	margin-top: -1em;
	font-size: .85em; 
}


/*-----------------------*/
/* L & R COLUMN DESIGN   */
/*-----------------------*/

.column_inner {
 	padding:14px;
}

#left_column .column_inner {
 	padding:8px;
}

* html .column_inner {
  	float:left; /* Needed for IE */
}

#left_column, #right_column, .column_inner { /* Prevent oversized content from breaking the layout */
  	overflow:hidden;
}

#left_column a {
 	color:#000;
}

#left_column ul {
 	margin: .4em .5em 1em 0;
}

#left_column ul ul {
 	margin: .2em 0 0 0;
}

.left_column_top {
 	margin:0;
 	padding:1px 0 34px 8px;
 	background:#bcc5d0 url('/../images/CAStandard/ca_department/left_column_divider.gif') no-repeat left bottom;
}

	.left_column_top a {
 	display:block;
}

.left_column_top a:hover, a:focus, a:active  {
 background:#ecece7; /* light gray */
}

.ColumnHeading {
  	font-size: 1.2em;
  	margin-bottom: 6px;
  	font-weight: bold;
}

/*-------------------------*/
/* TAB PANEL               */
/*-------------------------*/

.block_with_image_and_tabpanel {
 	padding-bottom:8px;
 	min-width:559px;
 	/* height:17em; Needed if there is no image to hold the container open. Adjust this depending on the height of your tabpanel. 
 	Have to override locally if this is used in different places on the site in different ways (pic or no pic, different number of tabs).*/
}

.block_with_image_and_tabpanel .image_container {
 	border: 1px solid;
 	background:#fff;
 	padding:7px 7px 7px 7px;
 	margin:5px 0 0 5px;
 	text-align:center;
 	float:left;
 	display:inline;
 	width:137px; /* Width for portrait photos, 123 + 14 = 137, needed for IE 5.0 */
 	overflow: hidden;
 	voice-family:"\"}\"";
 	voice-family:inherit;
 	width:auto; /* Width for portrait photos, for non-broken browsers */
}

.block_with_image_and_tabpanel .image_container img {
 	width: 123px;
 	height: 193px; /* Width and height are needed if images are turned off in the browser */
 	display:block;
}

#tabpanel_container {
 	padding:8px 8px 0 0;
 	margin:0 0 0 10px;
}

.contains_landscape_photo, .contains_portrait_photo {
 	height:auto;
}

.contains_landscape_photo #tabpanel_container {
 	margin:0 0 0 180px; /* Width for landscape photos up to 167px wide, 167 + 13 padding = 180 */
}

.contains_portrait_photo #tabpanel_container {
 	margin:0 0 0 150px; /* Width for portrait photos up to 123px wide, 123 + 27 padding = 150 */
}

#tabpanel {
 	margin:0;
 	width:99%;
}

#tab_list {
 	padding: 0;
 	position:relative; /* Makes this the containing block */
 	white-space: nowrap;
 	display:block;
 	z-index:10;
 	width:100%;
}

#tab_list ul {
 	position: absolute; /* Needed for IE 5.x */
 	margin: 0;
 	z-index:1;
 	padding: 0;
 	width:100%;
}
#tab_list ul#tab_ul {
 	height: 30px;
}

li#tabpanel_1, li#tabpanel_2, li#tabpanel_3, li#tabpanel_4, li#tabpanel_5, li#tabpanel_6, li#tabpanel_7, li#tabpanel_8 {
 	margin: 0;
 	float: left;
 	display: inline;
 	padding: 0;
}

#tab_list a.tab_link {
 	z-index:10;
 	position:relative;
 	color: #fff;
 	font-weight: bold;
 	text-decoration: none;
 	padding:8px 12px 0 12px; /* Adjust left and right padding to adjust width of the tabs */
 	display: block; /* Needed for Opera */
 	float:left; /* Needed for IE, breaks Opera */
 	background: url('/../images/CAStandard/ca_department/tabpanel_tabs.gif') no-repeat 100% -60px;
	height:30px; /* Needed for IE 5.x broken box */
	voice-family:"\"}\"";
 	voice-family:inherit;
 	height:22px; /* 30 - 8, for non-broken browsers */
}

html[xmlns] #tab_list a.tab_link {
 	float:none; /* Needed for Opera, breaks IE 6. Hack hides this from IE 6 */
}

#tab_list a:hover, a:focus, a:active  {
 	text-decoration: underline;
}

#tabpanel #tab_list li {
 	list-style-type: none;
 	list-style-image: none;
}

#tab_list ul ul {
 	position:absolute;
 	top:29px;
 	left:0;
 	display:none;
 	z-index:-10;
 	border:1px solid;
 	padding:12px 0 16px 0;
 	margin-left:0;
}

#tabpanel #tab_list ul ul li {
 	float: left;
 	width:48%;
 	background:url('/../images/CAStandard/ca_department/bullet_black.gif') no-repeat 6px .3em;
}

#tabpanel #tab_list ul ul li a {
 	float:none;
 	height:auto;
 	margin:0 0 0 24px;
}

#tab_list ul li.tabpanel_default ul, #tab_list ul li:hover ul {
 	display:block;
}

#tab_list li.tabpanel_default a.tab_link, #tab_list li:hover a.tab_link {
 	background: url('/../images/CAStandard/ca_department/tabpanel_tabs.gif') no-repeat right top;
 	color:#000;
 	text-decoration: none;
}

#tabpanel #tab_list li a.tab_link:hover { /* Needed for IE */
 	text-decoration: none;
}

#tabpanel #tab_list a:hover, a:focus, a:active #tabpanel #tab_list li.tabpanel_default ul a:hover, a:focus, a:active  {
 	text-decoration:underline;
}

#tabpanel ul ul a:hover, a:focus, a:active  {
 	background:transparent;
}

#tab_list .bottom_right { /* For the rounded corner */
 	position:absolute;
 	width:6px;
 	height:6px;
 	font-size:1px;
 	bottom:-2px;
 	right:-2px;
 	background: url('/../images/CAStandard/ca_department/tabpanel_corners.gif') no-repeat left top;
}
#tab_list .bottom_left { /* For the rounded corner */
 	position:absolute;
 	width:6px;
 	height:6px;
 	font-size:1px;
 	bottom:-2px;
 	left:-2px;
 	background: url('/../images/CAStandard/ca_department/tabpanel_corners.gif') no-repeat right top;
}

/*--------------------------------------------*/
/* CONTAINER BLOCK WITH ROUNDED CORNERS       */
/*--------------------------------------------*/

.block_with_rounded_corners {
 width:99%;
 border-style:solid;
 border-width:0 1px 1px 1px;
 position:relative; /* Make this the containing block of the corner spans */
 margin-bottom:16px;
}

.block_with_rounded_corners h3 {
 color:#fff;
 padding:5px 10px 5px 10px;
 margin:0;
}

.block_with_rounded_corners p {
 	margin: 1em;
}

.block_with_rounded_corners .bottom_right {
 position:absolute;
 width:6px;
 height:6px;
 font-size:1px;
 bottom:-2px;
 right:-2px;
 background: url('/../images/CAStandard/ca_department/block_with_image_corners.gif') no-repeat left top;
}

.block_with_rounded_corners .bottom_left {
 position:absolute;
 width:6px;
 height:6px;
 font-size:1px;
 bottom:-2px;
 left:-2px;
 background: url('/../images/CAStandard/ca_department/block_with_image_corners.gif') no-repeat right top;
}

.block_with_rounded_corners .top_right {
 position:absolute;
 width:6px;
 height:6px;
 font-size:1px;
 top:-1px;
 right:-2px;
 background: url('/../images/CAStandard/ca_department/block_with_image_corners.gif') no-repeat left bottom;
}

.block_with_rounded_corners .top_left {
 position:absolute;
 width:6px;
 height:6px;
 font-size:1px;
 top:-1px;
 left:-2px;
 background: url('/../images/CAStandard/ca_department/block_with_image_corners.gif') no-repeat right bottom;
}

.block_with_rounded_corners .list_decorative_scheme a:hover, a:focus, a:active  {
 background:transparent; /* Fixes problem in IE (dotted line disappears) */
}

/*--------------------------------*/
/* IMAGE CAROUSEL                 */
/*--------------------------------*/

/* No longer used (was only on home page) as of 2/19/13, but they may use it occasionally for required banners. */

#carousel {
	position: relative;
}

#caro_left {
	position: absolute;
	top: 22px;
	left: -10px;
}

#caro_right {
	position: absolute;
	top: 22px;
	right: -10px;
}

#caro_images1 {
	position: relative;
	overflow: scroll; /* Show scrollbars for graceful degradation when javascript is disabled. We'll change this to "hidden" in the javascript */
	height: 74px; /* carousel collapses on resize without this */
	padding: 7px 0;
}

#caro_images2 {
	white-space: nowrap; 
	position: absolute;
	padding: 0 6px;
}

#caro_images2 img {
	border: 0;
	vertical-align: middle;
	padding: 0 10px;
}

/*-------------------------------------------------------*/
/* Additions from AppBase.css for SASCore Internet Pages */
/*-------------------------------------------------------*/

/* BREADCRUMB NAVIGATION
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.Crumb			{ font-size: .9em; }
.Crumb a		{ }
.Crumb a:link		{ }
.Crumb a:visited 	{ }
.Crumb a:hover, a:focus, a:active  		{ }
.CrumbSelected		{ font-size: .9em; }
.CrumbSeparator		{ font-size: .9em; }

/*MESSAGES & STATUSES
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
/*---Message Bar---*/
.MessageBar	{ margin: .75em 0; }
.ErrorMessage	{ font-weight: bold; color: #c03; }
.ActionMessage	{ font-weight: bold; color: #30c; }
.SuccessMessage	{ color: #396; font-weight: bold; }
.InfoMessage	{ font-weight: bold; color: #000; }
.AlertMessage	{ font-weight: bold; color: #c03; }
.ValidatorText	{ font-weight: bold; color: #c03; margin: .75em 0; }
.NegativeNumber	{ color: #c03; }

/*---Status Indicator---*/
.Pending	{ color: #c90; }
.Active		{ color: #396; }
.Inactive	{ color: #c03; }
.Voided		{ text-decoration: line-through; }
.EntityNameAlert	{ color: #f30; }

.EnvironmentIndicator { font-weight: bold; background-color: #ff9; }
.AnnouncementIndicator /*For displaying announcement at top of pages when site is planned to be down*/
{
	font-weight: bold;
	background-color: #ff9;
	text-align: center;
}

/*DYNAMIC DATA GRIDS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.Grid { 
	margin: .75em 0;
	padding: .25em;
	border-style: solid;
	border-width: 1px;
	width: 100%;
}

.Grid td	{
	vertical-align: top; 
	padding: 2px;
}

.GridHeader 
{
	padding: 5px 15px 10px;
	font-weight: bold;
	font-size: .9em;
	text-align: left;
	text-transform: uppercase;
	text-decoration: none;
}
/* Is all this below needed? Doesn't some inherit from .GridHeader? */
.GridHeader a 	{ text-decoration: none; }
.GridHeader a:link	{ text-decoration: underline; }
.GridHeader a:visited { text-decoration: underline; }
.GridHeader a:hover, a:focus, a:active  { text-decoration: underline; }

.GridFooter	{ 
	border-bottom-style: solid;
	border-bottom-width: 1px;
	padding-top: .25em;
	padding-bottom: .25em;
}

.GridItem { background-color: #eee; padding-top: .25em; padding-bottom: .25em; }
.GridAlternatingItem { background-color: #fff; padding-top: .25em; padding-bottom: .25em; }
.GridSelectedItem { padding-top: .25em; padding-bottom: .25em; }
.GridEditingItem { padding-top: .25em; padding-bottom: .25em; }
.GridAlertItem { font-weight: bold; color: #c03; }
.GridPager { padding-top: .25em; padding-bottom: .25em; }
.GridEmptyDataRow { font-weight: bold; color: #c03; background-color: transparent; }

.GridPager a { text-decoration: none; }
.GridPager a:link	{ text-decoration: none; }
.GridPager a:visited { text-decoration: none; }
.GridPager a:hover	{ text-decoration: underline; }
.GridPager a:active { text-decoration: none; }

/* The following are not being used? */
.GridPagerShowAll { text-align: right; }
.GridPagerFilter { text-align: right; }
.GridPagerCount { text-align: right; }

.IsPrimary { font-weight: bold; }
/*highlights something like a primary contact */

.TotalValue { font-weight: bold; }

/*--GridFilter (Common usage is a people picker)--*/
.GridFilterBar	{  }

.GridFilterLink:link, .GridFilterLink:visited, .GridFilterLink:hover, .GridFilterLink:active
{
    font-size: 1.1em;
    font-weight: bold;
    text-decoration: none;
}

.GridFilterLinkSelected {
    font-size: 1.4em;
    font-weight: bold;
    text-decoration: none;
}

/*FORMS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
form {  }

.SearchForm, .SignInForm, .CRUDForm, .Form  {
	border-style: solid; 
	border-width: 1px; 
	padding: .25em; 
	margin: .75em 0;
}

.Form td {
	padding: .2em;
	vertical-align: top;
}

.SearchForm td {
	padding: .2em;
	vertical-align: top;
}

.CRUDForm td {
	padding: .2em;
	vertical-align: top;
}

.SignInForm td {
	padding: .2em;
	vertical-align: top;
}

fieldset {
	margin: 15px 5px 20px 0;
	padding: 5px;
	border: 1px solid;
}

legend {
	font-weight: bold;
	padding: .25em;
	margin-left: 5px;
}

.SearchForm legend { background-color: transparent; color: #000; }

.RightAlign, .RightAlignCell { text-align: right; }
.CenterAlign, .CenterAlignCell  { text-align: center; }
.LeftFieldLabel	{ font-weight: bold; text-align: right; }
.RightFieldLabel { font-weight: bold; }
.AboveFieldLabel { font-weight: bold; } /* For above big text boxes. */

.RightAlign .LeftFieldLabel,
.RightAlignCell .LeftFieldLabel	{ 
	display: inline; 
	float: right; 
	font-weight: bold; 
	white-space: nowrap;  
}

.FieldHelp + .LeftFieldLabel {
	display: inline;
	float: none;
	white-space: nowrap;
}

.LeftFieldLabel + .FieldHelp {
	display: inline;
	float: right;
	margin-right: 0.25em;
	white-space: nowrap;
} 

.RequiredMark + .LeftFieldLabel {
                display: inline;
                float: none;
                white-space: nowrap;
}

.RadioButton label { font-weight: bold; }

/*---Form Buttons---*/

.ButtonBar { clear: both; display: block; margin: .75em 0; }
.ButtonBarButton { }  /*Typical SASCore button bar buttons: Add/New/Cancel/Submit/Edit/Save */
.AddButton { margin-left: 90%; }  

/*---Form Fields Formatting---*/
.CityField { width: 50em; }
.NotesField { width: 100%; }
.DateField { width: 7em; }
.DateTimeField { width: 13em; }
.PhoneField	{ width: 20em; }
.DisplayField { padding: 2px; }
.NumberField { text-align: right; padding-right: 1px; }
.TextBoxWatermark { color: #aaa; font-style: italic; }
textarea { }

/*---Forms Miscellaneous---*/
.RequiredMark { color: #c03; font-weight: bold; font-size: 120%; }
.InputExample { font-style: italic; font-size: .9em; }
input, select, label { }
input[type=submit], input[type=reset] { line-height: 18px; }

/*Have not been able to separate these two yet.*/
.RecordMetaData	{ font-size: .9em; margin: .75em 0; }
.RecordMetaDataLabel  { font-weight: bold; }
.CreatedUpdatedLabel { font-weight: bold; font-size: .9em; margin: 2em 0 .75em 0; } /*This can go once the control is 
fixed*/

/*--Modal Popup--*/
.ModalPopup
{
	background-color: #ccc;
	border: solid 1px #999;
	padding: .25em; 
}
.ModalPopupBackground {
	background-color: #eee;
	filter: alpha(opacity=80); /* For IE Browser */
	opacity: 0.8; /* For Mozilla browser */
}

/*INFOSET: Used to group some information together on a page
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.InfoSet { border-style: solid; border-width: 1px; margin: .75em 0; padding: .25em; }
.InfoSetTitle 
{
	border-bottom-style: solid;
	border-bottom-width: 1px;
	font-weight: bold;
	margin: -5px;
	margin-bottom: 2px;
	padding: .25em;
}

.InfoSet div { clear: both; }

/* InfoSet2 is designed for the extended InfoSet control released in March 2009 */
.InfoSet2 {
    border-style: solid;
    border-width: 1px;
    margin: .75em 0;
}

.InfoSet2Title {
    font-weight:bold;
    padding: .25em;
    height: 5%; /*needed for standards-compliant-poor IE6*/
}

.InfoSet2Content {
    padding: .25em;
    border-top-style: solid;
    border-top-width: 1px;
}

.InfoSet2Help {
    font-size: .8em;
    font-weight: normal;
    color: #000;
}



/*-----------------------------------*/
/* Parsley.js Form Validation Styles */
/* Used in WIFS and other forms      */
/* Internal documentation at http://home.calrecycle.net/it/Apps/WIFS/SitePages/Adding%20Form%20Validation.aspx */
/*--------------------------------*/
input.parsley-success,
select.parsley-success,
textarea.parsley-success {
 }


input.parsley-error,
select.parsley-error,
textarea.parsley-error {
  color: #B94A48;
  background-color: #F2DEDE;
  border: 1px solid #EED3D7;
}


.parsley-errors-list {
  margin: 0 0 0 0 !important;
  padding: 0 0 0 0 !important;
  list-style-type: none;
  opacity: 0;
  -moz-opacity: 0;
  -webkit-opacity: 0;

  transition: all .3s ease-in;
  -o-transition: all .3s ease-in;
  -ms-transition: all .3s ease-in-;
  -moz-transition: all .3s ease-in;
  -webkit-transition: all .3s ease-in;
}

.parsley-errors-list.filled {
  margin: 1px 0 1px 0 !important;
  font-size: 0.9em;
  line-height: 0.9em;
  opacity: 1;
}






/*--------------------------------*/
/* CLASSIC ASP DEPRECATED STUFF
/* Can be deleted at some point.  */
/*--------------------------------*/

/* Highlight Box
-------------------------------------------- */

.HighlightBoxHeaderText {
	font-weight: bold;
	color: #fff;	
	font-size: .9em;
}

.HighlightBoxHeaderCell { background-color: #4d7fb2; }
	
.HighlightBoxBodyText { font-size: .9em; text-align: left; }

.HighlightBoxBodyCell { background-color: #eee; }

.NumberAlign	{ text-align: right; }
	
/* GRID-TYPE STYLES FOR HTML TABLES AND OLD ASP3 STUFF */
/* May want to rethink this as we get rid of older ASP pages */

.RowColor		{ background-color: #fff; }
.RowAltColor		{ background-color: #eee; }

.RowHighlight		{ background-color: #eee; }
.RowHighlight2		{ background-color: #ffc; }
.RowHighlight3		{ background-color: #ccc; }

.PagingRibbonCell	{ vertical-align: bottom; background-color: #4d7fb2; }
.PagingRibbonText	{ color: #fff; text-align: left; }
.PagingRibbonLink:link		{ text-decoration: underline; color: #fff; }
.PagingRibbonLink:visited 	{ text-decoration: none; color: #fff; }
.PagingRibbonLink:hover 	{ text-decoration: none; background-color: #eee; color: #4d7fb2; }
.PagingRibbonLink:active	{ text-decoration: none; color: #fff; }



/* HORIZONTAL NAVIGATION BARS */
/* Used in old ASP3 apps for linking to another view of details (selecting), */
/* e.g., Staff Directory or to bookmarks, e.g., Index */

.HNavRibbonCell	{ 
	vertical-align: bottom; 
	background-color: #4d7fb2;
	padding-left: .25em;
	padding-right: .25em;
	padding-top: .25em;
	padding-bottom: .25em;   
}
						
.HNavRibbonText			{ font-weight: bold; color: #fff; text-align: left; }
.HNavRibbonLink:link	{ font-weight: bold; color: #fff; text-decoration: none; }
.HNavRibbonLink:active	{ font-weight: bold; color: #fff; text-decoration: none; }
.HNavRibbonLink:visited { font-weight: bold; color: #fff; text-decoration: none; }
.HNavRibbonLink:hover 	{ font-weight: bold; color: #fff; text-decoration: underline; }



.HNavBar	{ background-color: #4d7fb2; }

.AlphaNavLink:link, .AlphaNavLink:visited, .AlphaNavLink:hover, .AlphaNavLink:active {
    font-size: 110%;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

.AlphaNavLinkSelected {
    font-size: 140%;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
}

.FormHeaderText {
	font-weight: bold;
	color: #ffffff;	
}

.FormHeaderCell	{ background-color: #4d7fb2; }

.ResultsGrid { 
	border: #253b5a 1px solid; 
	margin-top: .5em;
}

.ResultsGrid th, td { padding: 1px; }

.IDBarCell {
	background-color: #4d7fb2;
	padding-left: .25em;
	padding-top: .25em;
	padding-bottom: .25em;
}
.IDBarText {
	font-weight: bold;
	font-size: 90%;
	color: #fff; 
}
