/* Print styles */
/*@import url(../../Styles/print.css);*/
 
/* Screen styles */
/*@import url(../../Styles/screen.css);*/

/* CORE */
/* -----------------------------------*/
/* ---------->>> GLOBAL <<<-----------*/
/* -----------------------------------*/
html {
    height: 100%; 
    overflow: scroll; 
    width: 100%; 
    }
    
body {
    border-style: none;
    font: normal 100%/1.4 Arial, Helvetica, sans-serif; 
    margin: 0 auto; 
    padding: 0; 
    width: 1010px; 
    }
	
h1, h2, h3, h4, h5, h6 {
    font-family: 'Droid Sans', Arial, Helvetica, sans-serif; 
    font-weight: normal; 
    line-height: 1.375em; 
    }

h1, h2, h3 {clear: both;}
    
h1 {
    font-size: 1em;
    margin: 0 0 0.625em 0; 
    padding: 0.20em 0.625em; 
    }

/* non-color/theme rules for h2 and h3 */
h2  {
    font-size: 1em; 
    letter-spacing: 1px; 
    margin: 0 0 1em 0; 
    padding: 0.2em 0.625em;
    }
    
h3  {
    font-size: 0.875em; 
    letter-spacing: 1px; 
    margin: 0.625em 0 0.3em 0; 
    padding: 0.2em 0.625em;
    }

p {
    font-size: 0.8em;
    margin: 0;
    padding: 0.1em 0.625em 0.5em; 
  }

.psize {
    font-size: 0.8em;
    padding: 0;
  }

td, th {
    font-size: 0.8em;
    line-height: 1.6em;
    padding: 1px 5px;
    text-align: left;
    }

th {font-weight: bold;}
    
li {font-size: 0.8em;}
li li {font-size: 1.0em;}
li {list-style-type: none;}

.section, fieldset {
	clear: both;
	margin: 0 0 0.625em 0;
	padding: 0;
	}

/* -----------------------------------*/
/* ----->>> AUTHENTICATION BAR <<<----*/
/* -----------------------------------*/

/* no top_bar rules have anything to do with theme/color */
#top_bar {
    float: right;
    font-weight: bold; 
    margin: 0.675em 1.25em 1em 0; 
    }

#top_bar ul, #top_bar li {
    display:  inline;
    padding: 0; 
    }
    
#top_bar li {
    float: left; 
    font-size: 0.75em;
    padding-left: 0.8em; 
    padding-right: 0.8em; 
    }

#top_bar a {text-decoration: none;}
    
#top_bar a:hover, #top_bar a:active { text-decoration: underline; }

/* -----------------------------------*/
/* ---------->>> HEADER <<<-----------*/
/* -----------------------------------*/

#header  {
    background-color: #e6eaf0; 
    height: 90px; 
    margin: 0 0 0.625em 0; 
    padding: 0; 
    width: auto; 
    }
	
#header img.logo {
	left: 4px;
	position: relative;
	top: 15px;
	}

#header p.client {
    font-size: 1.25em; 
    font-weight: 700; 
    margin-top: 0.4em;
    padding-left: 3em; 
    }
    
/* -----------------------------------*/
/* ------>>> PAGE STRUCTURE <<<-------*/
/* -----------------------------------*/

#wrapper { padding: 0.45em 1.5em 0 1.5em; }

#footer  {
    background-color: #ffffff;
	clear: both; /* force #footer across full page bottom */    
    font-size: 0.75em; 
    margin: 0.85em 0 0 0; 
    padding: 1.25em 0 0 0; 
    text-align:center; 
    width: auto; 
	}
	
#wrapper_bottom { height: 1em; }

/* Layout */

.side {
    background-color: #ffffff;
    float: left; 
    margin-bottom: 0.7em; /* margin-bottom provides vertical space below this section */
    padding: 0; 
    width: 13.4em; 
    }
    
.main {
    background-color: #ffffff;
    float: left; 
    margin-bottom: 0.7em; /* creates vertical space before footer div */
    }

	/* 3-Column */
#triple .main {
    margin-left: 0.65em; 
    margin-right: 0.65em; 
    padding: 0; 
    width: 31.9em; 
    }
	
	/* 2-Column */
#double .main  {
    margin-left: 0.65em; 
    padding: 0;
    width: 45.95em; 
	}
	
	/* Full Width */
#full { width: auto; margin: 0; padding: 0; } 
#full.main{ float: none; } 

/* context_bar used on three-column pages to set a header for static data displays -- color for context_bar is set in Palette.css */
/* every one of these rules is superfluous
#context_bar {
    font-size: 1em; 
    font-weight: 500; 
    margin: 0 0 0.625em 0; 
    padding: 0.2em 0.625em;
    text-align: left; 
    }
                    - duplicating the existing h1 rule – vh 131101 */
/* -----------------------------------*/
/* -------->>> NAVIGATION <<<---------*/
/* -----------------------------------*/

/* core menu styles using DL/DT/DD tags; theme colors in palette.css */
.menugroup {margin: 0;}

.menugroup dl {
    margin: 0 auto; 
    padding: 0 0 0.625em 0;
    width: 150px; 
    }
    
.menugroup dt {
    font-family: 'Droid Sans', Arial, Helvetica, sans-serif; 
    font-size: 1em; 
    line-height: 1.375em;
    margin: 0; 
    padding: 0.2em 0.625em; 
    }
    
.menugroup dd {
    font-size: 0.8em;    
    font-weight: 700; 
    line-height: 1.75em;
    margin: 0; 
/*    padding: 0.2em 0 0.2em;       moved to .menugroup a to ‘fill’ the dd - vh 140107 */
    }

.menugroup a {
    display: inline-block;  /* inline-block is needed to allow a width assignment; width assignment is needed to allow hover anywhere on the dd */
    padding-left: 1.125em; 
    padding: 0.2em 0 0.2em 1.125em; /*        added to 'fill' the dd - vh 140107 */
    text-decoration: none; 
    width: 200px; 
    } 

.menugroup dd a img {float: right; padding-right: 0.4em;}

#glossary dt {
	clear: both;
/* redundant to default for dt 	display: block;     - vh 131106 */
	float: left;
	font-size: 0.8em;
	font-weight: 900;
	margin-bottom: 0;
	margin-left: 0.625em;
	padding-left: 0;
} 

#glossary dd {
	float: left;
	font-size: 0.8em;
	font-weight: 500;
	margin-left: 0.625em;
	width: auto;
	}

/* -----------------------------------*/
/* ------>>> SPECIAL ELEMENTS <<<-----*/
/* -----------------------------------*/
/* ELEMENTS --  any color rules in palette.css */
	
.clear { clear: both; }
	
/* reset css rules before beginning to use telerik styles */ 
.ReportToolbar {
	background-image: none !important; 
	height: 40px !important; 
	margin: 0; 
	padding: 0 0.625em; 
	}

.ReportToolbar input, .ReportToolbar select, .ReportToolbar button, .PageNumberText, .DisabledLink   { 
	font-family: Arial, Helvetica, 'sans-serif' !important;
	font-size: 13px !important;
    }
.Telerik td, .Telerik th {border-style: none; padding: 0; }

/* -----------------------------------*/
/* ----------->>> FORMS <<<-----------*/
/* -----------------------------------*/

/* FORM ELEMENTS	colors are handled in Palette.css */

label {
    font-size: 0.8em; /* added to compensate for removing font-size from .row rule - vh 131106 */
    font-weight: bold; 
    padding-right: 0.5em; 
    }

li label {
    font-size: 1.0em; 
    font-weight: 500;
    }

li li label {
    font-size: 1.0em; 
    font-weight: 500;
    }

input, textarea, select  {/* textarea is further specified in site.css */
    color: #3d3d3d; 
    padding: 0.2em; 
    width:auto; 
    }
	    
td select {font-size: 1.0em;}	  
	    
input[type="checkbox"], input[type="image"]{ width: auto; }
input[type="checkbox"], input[type="radio"] { margin-right: 0.4em; }

input[type="checkbox"], input[type="file"], input[type="text"], select, textarea {background-color: #ffffff;} /* forcing white background appears to 'expose' the inset appearance - vh 130212  */

input[type="image"], input[type="radio"] {border-style: none;}

select { width: 100%; }

input[type="button"], input[type="submit"] { /* margin and padding set in site.css */
	width: auto; 
	}

p input[type="submit"] {font-size: 1em;}

input[type="button"]:hover, input[type="submit"]:hover {color: #000000;}

table { /* added for testing setting font-size on .row - this, not being in a .row, constitutes an exception */
/* remove font-size from table because it is set on th/td and not on table                  
    font-size: 0.8em;                       - vh 131106 */
    }

.row table { /* added for testing sometimes datatables are in a .row - vh 130923 */
/* remove font-size from .row table because it is set on th/td and not on .row                       
    font-size: 1.0em;                       - vh 131106 */
    }

table th  {
/* these values are set in palette.css    
    background: #333; 
    border: 1px solid #ccc;
    color: #fff;          - vh 131106 */
/* these values are set in td, th or th rule    
    font-weight: bold; 
    padding: 1px 5px;         
    text-align: left;   -  vh 140103 */
    }
    
table.full {width: 100%;}
table.auto {width: auto;}
	
table .action_column { text-align: center; }

table select { width: auto; width: 100%}	/* changed for testing to match ConnectHR - vh 131108 */

/*  table td {text-align: left;}   text-align: these values are set in td, th rule - vh 140103 */

.ftable /* background color is set in palette.css */
{
	border-collapse: separate; 
	border-spacing: 1px;
	display: table;
	width: 100%;   
}

.gform {
	clear: both;
	margin-bottom: 0.25em;
	}
	
.gformindent {
	clear: both;
	margin-bottom: 0.25em;
	padding-left:  2.5em;
	}

.indent {
	padding-left:  1.25em;
	}

.row {
	display: table-row;
/*	font-size: 0.8em;   -   remove font-sizing to actual elements needing it - vh 131108 */
    }

/*  .row p {display: inline;} -- this appears to be virtually irrelevant, affecting slightly only some vertical spacing on some buttons on some pages - vh 140103 */

.ftable .row div {
	display: table-cell;
	background-color: #ffffff; /* important – prevents ftable background color from showing through to the form ‘cells’; individual cells then don’t need a background: white rule */
}

.ftable div.entire {background-color: #ffffff;}


.ftable .row ul, .gform ul, table ul {
	margin: 0;
	padding: 0;
}

.ftable .row ul li {
	font-family: "Courier New", Courier, monospace;
	margin-left: 1.4em; 
	}

table ul li {
	margin-left: 0.8em; 
	}

/* removed as redundant, gform sets only clear and margin-bottom    .gform .glabel, - vh 131028 */ .glabel {
	display: block;
	float: left;
	font-weight: 900; /* generally redundant since default for label is 900, but some asp:Labels render as <span> - vh 140108 */
	margin-bottom: 0.75em;  
	margin-left: 0.625em;
	padding: 0;
	width: 250px;       /* set this in ems after converting everything else to ems/percent  - vh 130911 */
	}

.gformindent .glabel {
	display: block;
	float: left;
/*	font-weight: 900;       default for label is 900, this is redundant - vh 131106 */
	margin-left: 0.625em;
	width: 210px;       /* set this in ems after converting everything else to ems/percent  - vh 130911 */
	}

.gform .gdata {
	display: inline-block;
	width: auto;
	}

.gform .gdatawide { /* any details in site.css */
	display: inline-block;
	}

.gform .orgcodeinput {
	display: inline-block;
	width: 34em;
	}

.subform {/* added for slight indent fixed width */

	margin-left: 0.625em;
	width: 675px;        /* set this in ems after converting everything else to ems/percent  - vh 130911 */
    }  

.formdata {
	display: block;
	font-family: "Courier New", Courier, monospace;
	font-size: 1em;
	margin-left: 1.4em; 
	}

.formlink {
	display: block;
	margin-left: 1.4em; 
	}

.fauxform {
	border-collapse: separate;
	border-spacing: 1px;
	display: table;
	width: 100%;   
    }

.fauxform .row div {
	display: table-cell;
}

.ftable .row .gdata {
	font-family: "Courier New", Courier, monospace;
	margin-left: 0.8em; 
	}
	
.ftable .row div.gform, .ftable .row div.gformindent {display: block;}

.ftable .row p {padding-top: 0; padding-bottom: 0; margin-top: 0; margin-bottom: 0;}

.ftable select, .ftable input[type="text"] {margin-left: 1em;}

/* The following row-based classes allow .ftable rows to be split into sections as long as all those in a row total 100%. 
But any <div class="ftable"> (which uses display: table) must have all sections the same width. A different set of section widths requires closing the existing ftable div and starting a new ftable div */

.row div.fourpercent {
	width: 4%;
	}
.row div.sevenpercent, .row div.sevenpercentfinal {
	width: 7%;
	}
.row div.eightpercent {
	width: 8%;
	}
.row div.ninepercent, .row div.ninepercentfinal {
	width: 9%;
	}
.row div.twelvepercent {
	width: 12%;
	}
.row div.oneeighth {
	width: 12.5% 
	}
.row div.thirteenpercent {
	width: 13%;
	}
.row div.fifteenpercent, .row div.fifteenpercentfinal {
	width: 15%;
	}
.row div.onesixth, .row div.onesixthfinal {
	width: 16.66666666%;
	}
.row div.twentypercent {
	width: 20%;
	}
.row div.twentythreepercent {
	width: 23%;
	}
.row div.onequarter {
	width: 25%;
	}
.row div.thirtypercent {
	width: 30%;
	}
.row div.onethird, .row div.onethirdfinal {
	width: 33.333333333%;
	}
.row div.threeeighths {
	width: 37.5%;
	}
.row div.onehalf{
	width: 50%; 
	}
.row div.twothirds {
	width: 66.66666666%;
	}
.row div.seventypercent {
	width: 70%;
	}
.row div.threequarter {
	width: 75%;
	}
.row div.eightypercent {
	width: 80%;
	}
.row div.entire {
	width: 100%;
	}
/* categories (tentative) for organizing style sheets 
Global Styles – (body, paragraphs, lists, etc)
Header
Page Structure
Headings
Text Styles
Navigation
Forms
Comments
Extras
*/