/* ==|== primary styles =====================================================
   Author: www.prowebdesign.ro
   Write your own styles here.
   ========================================================================== */

html{
	height: 100%

}

/* typography */
body{
    height: 100%;
    margin: 0;
    background-repeat: no-repeat;
    background-attachment: fixed;
	font-family:Arial, Helvetica, sans-serif; 
	font-size:1em; line-height:normal; 
	font:16px/26px Helvetica, Verdana, Arial, Helvetica, sans-serif;
	background: rgb(95,165,222);
	background: -moz-linear-gradient(2rgb(68, 148, 214) 1%, rgb(197, 215, 229) 70%) fixed;
	background: -webkit-linear-gradient(rgb(68, 148, 214) 1%, rgb(197, 215, 229) 70%) fixed;
	background: -o-linear-gradient(rgb(68, 148, 214) 1%, rgb(197, 215, 229) 70%) fixed;
	background: -ms-linear-gradient(rgb(68, 148, 214) 1%, rgb(197, 215, 229) 70%) fixed;
	background: linear-gradient(rgb(68, 148, 214) 1%, rgb(197, 215, 229) 70%) fixed;
}
	
body.noback{
    height: 100%;
    margin: 0;
	font-family:Arial, Helvetica, sans-serif; 
	font-size:1em; line-height:normal; 
	font:16px/26px Helvetica, Verdana, Arial, Helvetica, sans-serif;
	background:#FFFFFF;
}
	
	
/* typography */
body.reports{
	background:#ffffff;
	font-family:Arial, Helvetica, sans-serif; 
	font-size:1em; line-height:normal; 
	font: 78%/1.8 Arial, Helvetica, sans-serif;
	background-color: #ffffff;
	height:100%;
	margin:0;
	font:16px/26px Helvetica, Verdana, Arial, Helvetica, sans-serif;
	}
	
	
h1, h2, h3, h4, h5, h6{
	font-weight:normal;
	/*font-family:'Cuprum', Arial, Helvetica, sans-serif; */
	margin:0;
	padding:0; 
	line-height:120%} 


/* links */

a,
a:visited,
a:active
a:hover{color:#366FA7;}
a:hover{ text-decoration:none;}

a.nounder:link, a.nounder:visited, a.nounder:active {
	text-decoration: none;
	border-bottom:0px none #000000;
}

a.nounder:hover{
	text-decoration: none;
	border-bottom:none;	
}
a.mainLink:link, a.mainLink:visited, a.mainLink:active {
	color: #366FA7;
	text-decoration: none;
	border-bottom:1px dotted #000000;	
}

a.mainLink:hover{
	color: #3f3f1f;
	text-decoration: none;
	background-color: #d3d2b6;
	border-bottom:none;	
}

  
/* structure */
#container{
	max-width: 960px;
	max-width: 1050px;
	margin: auto;
	background-color:#FFFFFF;
	margin-top:30px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	border-radius: 10px;
	-webkit-box-shadow: #666 0px 2px 3px;
	-moz-box-shadow: #666 0px 2px 3px;
	box-shadow: #666 0px 2px 3px;
	behavior: url(/PIE.htc);
}


#container-login{
	max-width: 400px; 
	margin: auto;
	background-color:#FFFFFF;
	/*margin:5em auto;*/
	padding-top:10px;
	border:8px solid #eee;
	margin-top:75px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	-webkit-box-shadow: #666 0px 2px 3px;
	-moz-box-shadow: #666 0px 2px 3px;
	box-shadow: #666 0px 2px 3px;
	behavior: url(/PIE.htc);
}

#container-forms{
	margin: auto;
	background-color:#E7F0FA;
	padding:10px;
	border:1px solid #eee;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	behavior: url(/PIE.htc);
}

#container-login h1{
	background:#0092c8;
	color:#fff;
	text-shadow:#007dab 0 1px 0;
	font-size:14px;
	padding:18px 23px;
	margin:0 0 1.5em 0;
	border-bottom:1px solid #007dab;
	}

#container-login .message{font-size:1em;}


#container-login .back{padding:.5em 0;border-top:1px solid #eee;text-align:right;font-size:.8em;}


#colophon{
	max-width: 960px; 
	margin: auto;
	margin-top:15px;
}


header{ 
	/*margin: 0 0 20px 0;*/}
	
	
header, header nav, #main, footer{
	width:100%;}


#banner{
	background-color:#FFFFFF;
	width:100%;
}		
	
	
#logo{ 
	float:left; 
	padding-right:3%;
	padding-left:2%;
	
	}
	
header{
	/*padding:10px 0 40px 0;*/
	background-color:#FFFFFF;
	margin-top:10px;
	padding:0px 0 0 0;

	}
	
header h1{ 
	font-size:3.2em;}
	
header h2{ 
	font-size:1.8em;
	font-size:1em; 
	}



#main, footer{ 
	font-size:.875em; 
	line-height:1.4em;
	}

		
#main p{ 
	margin:20px 0 20px 0;
}

.Column1 {
	padding-left: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 170%;
}


#content {  
	float:right;
	/*margin:0 0 20px 0;*/
	background-color:#ffffff;
	margin-top:1em;
	}
	
#content ul, #content ol {
	margin: 1em 0;
	padding: 0 0 0 20px; }
	
	
#content dd {
	margin: 0 0 0 40px; }

/* RESPONSIVE IMAGES IN CONTENT AREA!! IF YOU WANT IMAGES TO BE RESPONSIVE EVERYWHERE, WRITE ANOTHER CSS RULE */
#content img{ max-width:100%; height:auto;}

#content-internal-menu {
	padding: 0px;
	float: none;
	clear:both;
	text-align: center;
	border: 1px solid #71a7c8;
}

#content-internal-menu-overview {
	padding: 0px;
	float: none;
	clear:both;
	text-align: center;
	/*background-image: url(../graphics/overview-back.jpg);*/
	background-repeat: repeat-y;
	background-position: left;
	background-color: #E7F0FA;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 170%;
	border: 1px solid #71a7c8;
}


#overview-right {
	width: 250px;
	float: right;
	clear: right;
	padding: 5px;
	padding-right: 5px;
	background-color: #ffffff;
}


#overview-left {
	width: 620px;
	float: left;
	clear: both;
	padding: 5px;
	padding-left: 25px;
	text-align: left;
	line-height: 120%;
	/*background-color: #E7F0FA;*/
}



aside { 
	float:left;
	margin:0 0 40px 0;
	}
	
div.scroll {
	height: 240px;
	overflow: auto;
	border: 1px solid #CCCCCC;
	padding: 8px;
}

footer{  
	clear:both;
	font-size:80%;
	padding:20px 0; 
	color: #666666;
	}

/*colors and bgs*/


h1,h3, h4, h5, h6{
	color:#8ebd01; 
	text-shadow:0 2px 0px #fff;}


h2{
	color:#7CA501;
	font-weight:bold; 
	font-size:2em;
	text-shadow:0 2px 0px #fff;}
	
h3{
	color:#000000;
	text-shadow:none;
}

	

h4{
	font-size:1.5em;
	color:#000000;
	text-shadow:none;}
}

footer{ 
	/*background:url(../images/footer-bg.png) top repeat-x;
	color:#ccc;*/
	
	}

footer h1, footer h2, footer h3, footer h4{ 
	color:#CCC; 
	margin-bottom:10px;
	text-shadow:none;}
	
footer ul{
	margin:0 0 0 8%;}

a.bluelink{ 
	background:#0099ff; 
	border-radius:7px; 
	color:#fff;
	display:block;
	float:left; 
	margin:10px 15px 10px 0; 
	padding:15px;}


#cname {
	/*padding-left: 120px;*/
	padding-top: 30px;
	font-size: 1.2em;
}

.formText {
	line-height: 1.2em;
	font-size: 1.4em;
}

.buttonBorder {
	border: 1px solid #999999;
	padding: 1px;
}
.buttonBorder:hover{
	padding: 1px;
	border: 1px inset #999999;

}


.div-line {
	background-repeat: repeat-x;
	background-position: center;
	background-color: #aaccee;
	height: 2px;
}

.ErrMsg 
{
	color: #990000;
	font-weight: bold;
}

.highlightedText{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: #DBEDC9;
	border: thin solid #006600;
	padding-left: 10px;
	padding-right: 10px;
}


/* for client search */
.highlight {
    background-color: #fff34d;
}

.imageBorder {
	border: 1px solid #999999;
	padding: 1px;
}

.iconimageBorder {
	border: 1px solid #000000;
}

.iconpadding {
     margin-left:4px;
     margin-bottom: -1px;
}



.LargeFont {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: 150%;
	font-weight: bold;
}

.littleMsg {
	/*padding-left: 120px;*/
	font-size: .8em;
}


.ltbackground{
	background-color: #E7F0FA;
}

.padInput{
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left : 2px;
	padding-right: 2px;
}

.redColor {
	color: #CE0000;
}

.blueColor {
    color: #002399;
}

.redback{
	background-color: #FFD9D9;
}

.changeIndicator{
	background: #FFD9D9;
}

.SectionTitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #366FA7;
	margin: 0px;
	font-weight: bold;
	padding-bottom: 5px;
}

.smallerFont{
	font-size:.8em; line-height:normal; 
}


.tableHeading {
	color: #37371C;
	background-color: #E7F0FA;
	font-weight: bold;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

.whitebackground{
	background-color: #FFFFFF;
}


#clear {clear:both;}


.left {
	clear:none;
	float:left !important;
	margin-right:0.3em !important;
}
.right {
	clear:none;
	float:right !important;
	margin-left:0.3em !important;
}


/* ====================

MISC 

*/


#divCol30 {
	position:relative;
	float:left; 
	width:30%;
}

#divCol38 {
	position:relative;
	float:left; 
	width:38%;
}

#divCol31 {
	position:relative;
	float:left; 
	width:31%;
}


#divCol49 {
	position:relative;
	float:left; 
	width:49%;
}

#divCol40-left {
	width: 40%;
	float: left;
	clear: both;
	padding-right:25px;
}

#divCol40-right {
	width: 40%;
	float: left;
	clear: right;
	padding-left:30px;
}

#reconcile-content-right {
	width: 605px;
	float: left;
	text-align: right;
	padding: 0px;
}

#reconcile-content-left {
	width: 150px;
	float: left;
	padding: 0px;
	border: 1px solid #666633;
	color: #37371C;
	background-color: #F1F1EB;
}


.inactiveLink {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 170%;
	color: #666666;
}

.chartTableCell {
	border: 1px solid #999966;
}


.PrintOnly {
	display:none ;
}

tr.alt td{
	background-color: #EBF3FA;
}

.stdbackground{
	background-color: #aaccec;
}

tr.over td{
	background-color: #aaccec;
}

.very_ltbackground{
	background-color: #F1F1EB;
}

.redbackground{
	background-color: #FFD9D9;
}


.ts_regularbackground{
	background-color: #EBF4E1;
}

.ts_otbackground{
	background-color: #FFFFF2;
}

.ts_sickbackground{
	background-color: #F8FCF8;
}

.ts_vacbackground{
	background-color: #F2F8FF;
}

.ts_hldybackground{
	background-color: #FFF9F9;
}

.ts_totalsbackground{
	background-color: #F7F7F7;
}

.imageBorder {
	border: 1px solid #999999;
	padding: 1px;
}

.iconimageBorder {
	border: 1px solid #000000;
}

.buttonBorder {
	border: 1px solid #999999;
	padding: 1px;
}

.buttonBorder:hover{
	padding: 1px;
	border: 1px inset #999999;
}

/* set different button classes to fire off different AJAX routines*/

.buttonDelete {
	border: 1px solid #999999;
	padding: 1px;
}

.buttonDelete:hover{
	padding: 1px;
	border: 1px inset #999999;
}

.buttonAdd {
	border: 1px solid #999999;
	padding: 1px;
}

.buttonAdd:hover{
	padding: 1px;
	border: 1px inset #999999;
}

.buttonEdit {
	border: 1px solid #999999;
	padding: 1px;
}

.buttonEdit:hover{
	padding: 1px;
	border: 1px inset #999999;
}

.alignRight{
	text-align:right;
}

.alignCenter{
	text-align:center;
}

.ScreenImageBorder {
	border: 3px solid #366FA7;
	padding: 2px;
}

.hideltBoxOutline {
	text-align: right;
	border: thin solid #D9E6D9;
	background-color: #d9e6d9;
}

.whitebackground{
	background-color: #ffffff;
}

.hideBoxOutline {
	text-align: right;
	border: thin solid #FFFFFF;
}

.hideBoxOutlineBoldText {
	text-align: right;
	border: thin solid #FFFFFF;
	font-weight: bold;
	color: #990000;
}

.hideBoxOutlineAlignLeft {
	border: thin solid #FFFFFF;
}



.alignRight {
	text-align: right;
}

.ErrMsg 
{
	color: #990000;
	font-weight: bold;
}

.WarningMsg 
{
	color: #FF6600;
	font-weight: bold;
}

.SuccessMsg 
{
	color: #006600;
	font-weight: bold;
}

.LargeMsg 
{
	color: #990000;
	font-weight: bold;
	font-size: 12px;
}

.pageTextSpaced {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 3em;
}

.pageTextSmallInternal {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 1.6em;
}
.PageTitle {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #3F3F1F;
	padding-right: 0px;
	padding-bottom: 0px;
	font-style: normal;
	line-height: normal;
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 5px;
	margin-left: 0px;
	padding-top: 0px;
	background-position: left;

}

.SmallFont {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 110%;
	font-size: 10px;
	letter-spacing: normal;
}

.SmallFontTable {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .8em;
}

.smallItalic {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	letter-spacing: normal;
	font-style: italic;
}

.smallItalicLight {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 10px;
	letter-spacing: normal;
	font-style: italic;
	color: #999999;
}

.handcursor{
	cursor:hand;
	text-decoration: underline;
	text-decoration: none;
	border-bottom:1px dotted #000000;
}

.Column1 {
	padding-left: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
}


.ColumnA {
	padding-left: 10px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 170%;
	width: 180px;
	float: left;
	clear: both;
}

.ColumnB {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 170%;
	width: 300px;
	float: right;
	clear: right;
}
.smallLight {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	letter-spacing: normal;
	font-style: normal;
	color: #666666;
}

.hilitebox {
	background-color: #F1F1EB;
	width: 422px;
	color: #000000;
	padding: 5px;
	margin: 5px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 11px;
	line-height: 1.5em;
	border: 2px solid #999966;
}

hr{
	color: #666666;
	height: 1px;
	width: 100%;
	text-align: center;
}


/*Table Striping */

tr.alt td{
	background-color: #EBF3FA;
}

tr.white td{
	background-color: #ffffff;
}


tr.redback td{
	background-color: #FFA8A8;
}


tr.over td{
	background-color: #aaccec;
}


// for overview show hide
.show_hide {
	display:none;
}

#wr {
	width:100%;
	text-align: left;
	background-position: left;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto;
}
.trigger,.trigger a {
	float:left;
	width: 50px;
	height: 15px;
	text-indent: -999999em;
	overflow: hidden;
	text-decoration: none;
	vertical-align: baseline;
}


.trigger {
	/*background: url(../images/btn.png) no-repeat 0px 0px;*/
	background: url(../graphics/show-hide.png) no-repeat 0px 0px;
}
.close {
	/*background: url(../images/btn.png) no-repeat 0px -26px;*/
	background: url(../graphics/show-hide.png) no-repeat 0px -15px;*/
}
.cnt {
	display: none;
	margin-left: 10px;

}
.cl {
	width: 100%;
	clear: both;
	line-height: 0px;
	font-size: 0px;
}

#divChartContainer{
	background-position:center;
	width:852px;
	text-align:center;
	border-top-width: thin;
	border-right-width: thin;
	border-bottom-width: thin;
	border-left-width: thin;
	border-top-style: none;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	border-top-color: #006699;
	border-right-color: #006699;
	border-bottom-color: #006699;
	border-left-color: #006699;
	padding-bottom:20px;
}


#divChartBox {
	position:relative;
	float:left;  
	width:425px;
	/*height:290px;*/
	padding-top:15px;
}


#divChartBoxCompareTable{
	padding-top:30px;
}

#divChartBoxCompare{
}


#divChartBoxCompareHalf {
	position:relative;
	float:left;  
	width:425px;
	text-align:center;
}


#divChartBox2 {
	position:relative;
	float:left;
	width:852px;
	padding-top:10px;
	padding-bottom:10px;
	border: thin solid #006699;
	background-color: #EBF3FA;
}

#printOnly {
	display: none;
}
/* ===========================================================
	css to removed dialog box title bar
*/
.no-title .ui-dialog-titlebar {
  display: none;
}

/* ===========================================================
  Reset input and select since normalize.css wipes things out
   ========================================================================== */


input  { 
	/*line-height: 1.1em;*/
	border-style: solid;
	border-width: 1px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	/*ie7*/
	*width: 99%;
	/*padding:3px;*/
	/*border-color:#c6c6c6 #dadada #eaeaea;*/
	border-color:#c6c6c6;
	/*font-size:1.4em;
	font-family:inherit;*/
	/*corner*/
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	padding:2px;
}	


select  { 
	line-height: 1.1em;
	border-style: solid;
	border-width: 1px;
	box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	/*ie7*/
	*width: 99%;
	padding:3px;
	/*border-color:#c6c6c6 #dadada #eaeaea;*/
	border-color:#c6c6c6;
	font-family:inherit;
	/*corner*/
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
}


select.formSelect {
	border-color:#c6c6c6;
	font-size:1.1em;
	font-family:inherit;
	/*corner*/
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	padding-right:5px;
}

input.formSelectCount {
 	font-size:1em;
	padding:1px;
	text-align:center;
	margin-top:10px;
}

#content-right {
	width: 400px;
	float: left;
	text-align: left;
	clear: right;
	padding: 5px;
	padding-left: 50px;
}


#content-left {
	width: 370px;
	float: left;
	clear: both;
	padding: 10px;
	padding-right: 25px;
	padding-left: 30px;
}



#content-right-formmenu {
	width: 320px;
	float: left;
	text-align: left;
	clear: right;
	padding: 5px;
	padding-left: 30px;
	line-height:1.8em;
	
}


#content-left-formmenu {
	width: 320px;
	float: left;
	clear: both;
	padding: 5px;
	padding-right: 25px;
	line-height:1.8em;

}

/* ===========================================================
  MAIN TABLE STYLES
   ========================================================================== */

table th
{
	padding:.5em;
	/*font-size: 1.3em;*/
	font-family:Verdana, Helvetica, sans-serif; 
    border: 1px solid #71a7c8 !important;
    background-color: #B6D1EF!important;
}


/* Header Row Colors */
table thead tr {
   /* background-color: #71a7c8 !important;
    color: #fff !important;*/
}


/* Table Border Color */
table td {
    border: 1px solid #71a7c8 !important;
    /*border-bottom: 1px solid #71a7c8 !important;
    border-top: 1px solid #71a7c8 !important;
	font-size: .9em;
	font-family:Verdana, Helvetica, sans-serif; 
    /*background-color: #E7F0FA !important;*/
	padding:.6em;

}



/* ===========================================================
  SORTABLE TABLE STYLES
   ========================================================================== */

table.sortable td
{
	padding:.6em;
}

table.sortable th
{
	padding:.6em;
	text-align:left;
}


/* Header Row Colors */
table.sortable thead tr {
    background-color: #71a7c8 !important;
    color: #fff !important;
}

/*  Highlight Color for Header Row Cells on Hover*/
table.sortable th:hover:not(.sorttable_nosort) {
    background: #b3d0e1 !important;
}

/* Shading For Even Rows */
table.sortable tr:nth-child(even) { 
	background: #EBF3FA !important; 
	}


/* Table Border Color */
table.sortable th,
table.sortable td {
   /* border: 1px solid #71a7c8 !important;*/
    border-bottom: 1px solid #71a7c8 !important;
	font-size: .8em;
	font-family:Verdana, Helvetica, sans-serif; 
}

table.sortable tr:hover td {
  background-color: #aaccec; 
}



/*  Style & Width of Particular Columns 
table.sortable td.col3,
table.sortable td.col4,
table.sortable td.col5,
table.sortable td.col6,
table.sortable td.col7 {
    text-align: center !important;
    width: 10% !important;
}
*/

/* ===========================================================
  POPUP /AJAX TABLE STYLES
   ========================================================================== */


/* Header Row Colors */
table.popup thead tr {
    background-color: #71a7c8 !important;
    color: #fff !important;
}


/* Table Border Color */
table.popup th,
table.popup td {
   /* border: 1px solid #71a7c8 !important;*/
    border-bottom: 1px solid #71a7c8 !important;
	font-size: .7em;
	font-family:Verdana, Helvetica, sans-serif; 
	padding:.3em;

}

table.popup tr:hover td {
  background-color: #aaccec; 
}


/* @group Form Buttons */

/* #Form Buttons
================================================== */

	button,
	input[type="submit"],
	input[type="reset"],
	input[type="button"] {
	  color: white;
	 /* margin-bottom: 20px;*/
	  line-height: 21px;
	  font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif; 
	  padding: 8px 1em 9px 1em;
	  font-size: 1em;
	  line-height: 20px;

		-webkit-border-radius: 4px;
		-moz-border-radius: 4px;
		border-radius: 4px;
		background: #5aa1d8;
		background: -webkit-gradient(linear, 0 0, 0 bottom, from(#5aa1d8), to(#2489d6));
		background: -webkit-linear-gradient(#5aa1d8, #2489d6);
		background: -moz-linear-gradient(#5aa1d8, #2489d6);
		background: -ms-linear-gradient(#5aa1d8, #2489d6);
		background: -o-linear-gradient(#5aa1d8, #2489d6);
		background: linear-gradient(#5aa1d8, #2489d6);
		-pie-background: linear-gradient(#5aa1d8, #2489d6);
	  -moz-box-shadow: inset 0 1px 0 0 #85b9e0;
	  -webkit-box-shadow: inset 0 1px 0 0 #85b9e0;
	  -o-box-shadow: inset 0 1px 0 0 #85b9e0;
	  box-shadow: inset 0 1px 0 0 #85b9e0;

		behavior: url(/PIE.htc);}
	  
	button:hover,
	input[type="submit"]:hover,
	input[type="reset"]:hover,
	input[type="button"]:hover {
		/*color: #222;
		color: #99CCFF;*/
		color: #CBE4B1;
		background: linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Old browsers */
		background: -moz-linear-gradient(top, rgba(255,255,255,.3) 0%, rgba(0,0,0,.3) 100%); /* FF3.6+ */
		background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,.3)), color-stop(100%,rgba(0,0,0,.3))); /* Chrome,Safari4+ */
		background: -webkit-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Chrome10+,Safari5.1+ */
		background: -o-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* Opera11.10+ */
		background: -ms-linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* IE10+ */
		background: linear-gradient(top, rgba(255,255,255,.3) 0%,rgba(0,0,0,.3) 100%); /* W3C */
	  border: 1px solid #ccc;
	  border-top: 1px solid #ccc;
	  border-left: 1px solid #ccc;
	  border-bottom: 1px solid #9d9d9d;

	  background-image: -o-linear-gradient(#2380c7, #4a95cf);
	  background-image: -webkit-linear-gradient(#2380c7, #4a95cf);
	  background-image: -moz-linear-gradient(#2380c7, #4a95cf);
	  background-image: -o-linear-gradient(#2380c7, #4a95cf);
	  -pie-background: linear-gradient(#2380c7, #4a95cf);
	  -moz-box-shadow: inset 0 1px 0 0 #75acd7;
	  -webkit-box-shadow: inset 0 1px 0 0 #75acd7;
	  -o-box-shadow: inset 0 1px 0 0 #75acd7;
	  box-shadow: inset 0 1px 0 0 #75acd7;
	  cursor: pointer;

}
	  
  	button:active,
	input[type="submit"]:active,
	input[type="reset"]:active,
	input[type="button"]:active {
    background: #990000; /* Old browsers */
    background: -moz-linear-gradient(top, rgba(0,0,0,.3) 0%, rgba(255,255,255,.3) 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,.3)), color-stop(100%,rgba(255,255,255,.3))); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, rgba(0,0,0,.3) 0%,rgba(255,255,255,.3) 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, rgba(0,0,0,.3) 0%,rgba(255,255,255,.3) 100%); /* Opera11.10+ */
    background: -ms-linear-gradient(top, rgba(0,0,0,.3) 0%,rgba(255,255,255,.3) 100%); /* IE10+ */
    background: linear-gradient(top, rgba(0,0,0,.3) 0%,rgba(255,255,255,.3) 100%); /* W3C */
    border: 1px solid #888;
    border-bottom: 1px solid #aaa;
    border-right: 1px solid #aaa; 
	
	  -moz-box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
	  -webkit-box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
	  -o-box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
	  box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
	  border: 1px solid #2280c9;

	}
	
	button.full-width,
	input[type="submit"].full-width,
	input[type="reset"].full-width,
	input[type="button"].full-width { 
		width: 100%;
		padding-left: 0 !important;
		padding-right: 0 !important;
		text-align: center; }


/* @end */



/* @group Styled Buttons */

.button-alt,
.button,
.button.small,
.button.large,
.button.medium {
	background-image: none;
	padding: 8px 1em 9px 1em;
	font-size: .95em;
	margin: 0;
	display: inline-block;
	font-family: arial,helvetica,sans-serif;
	font-stretch: narrower;
	font-weight: bolder;
	text-align: center;
	text-decoration: none;

}


.button.left {
	float: left;
}
.button.right {
	float: right;
}
.button.center,.button.middle {
	margin: 0px auto;
	text-align: center;
	display: inherit;
}

.button-alt a,.button a,.button.small a {
	/*font-size: .9em;
	line-height: 14px;*/
	font-size: .7em;
	line-height: 11px;
}
.button.medium a {
	font-size: 1.2em;
	line-height: 20px;
}
.button.large a {
	font-size: 1.4em;
	line-height: 24px;
}
.button span.btn_caption {
	font-weight: normal;
	display: inline-block;
	font-size: 14px;
	line-height: 14px;
}

/* @group Light Blue  */
a.button-alt,a.button.lightblue {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #5aa1d8), color-stop(100%, #2489d6));
  background-image: -webkit-linear-gradient(#5aa1d8, #2489d6);
  background-image: -moz-linear-gradient(#5aa1d8, #2489d6);
  background-image: -o-linear-gradient(#5aa1d8, #2489d6);
  -pie-background: linear-gradient(#5aa1d8, #2489d6);
  border: 1px solid #258cda;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -o-border-radius: 3px;
  -ms-border-radius: 3px;
  -khtml-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 0 1px 0 0 #85b9e0;
  -webkit-box-shadow: inset 0 1px 0 0 #85b9e0;
  -o-box-shadow: inset 0 1px 0 0 #85b9e0;
  box-shadow: inset 0 1px 0 0 #85b9e0;
  color: white;
  text-shadow: 0 1px 0 #1976be;
  /*behavior: url("./wp-content/themes/element/PIE.php");*/
  behavior: url("PIE.php");
  position: relative;
}
a.button-alt:hover,
a.button.lightblue:hover {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #2380c7), color-stop(100%, #4a95cf));
  background-image: -webkit-linear-gradient(#2380c7, #4a95cf);
  background-image: -moz-linear-gradient(#2380c7, #4a95cf);
  background-image: -o-linear-gradient(#2380c7, #4a95cf);
  -pie-background: linear-gradient(#2380c7, #4a95cf);
  -moz-box-shadow: inset 0 1px 0 0 #75acd7;
  -webkit-box-shadow: inset 0 1px 0 0 #75acd7;
  -o-box-shadow: inset 0 1px 0 0 #75acd7;
  box-shadow: inset 0 1px 0 0 #75acd7;
  cursor: pointer;
}
a.button-alt:active,
a.button.lightblue:active {
  -moz-box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
  -webkit-box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
  -o-box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
  box-shadow: inset 0 0 8px 4px #2278b9, inset 0 0 8px 4px #2278b9, 0 1px 1px 0 #eeeeee;
  border: 1px solid #2280c9;
}
a.button.lightblue span.btn_caption {
  color: #acd3f1;
  text-shadow: 0 1px 0 #1976be;
}

/* @end */
/* @group Blue  */
a.button.blue {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #597db1), color-stop(100%, #3a6198));
  background-image: -webkit-linear-gradient(#597db1, #3a6198);
  background-image: -moz-linear-gradient(#597db1, #3a6198);
  background-image: -o-linear-gradient(#597db1, #3a6198);
  -pie-background: linear-gradient(#597db1, #3a6198);
  border: 1px solid #3b639b;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -o-border-radius: 3px;
  -ms-border-radius: 3px;
  -khtml-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 0 1px 0 0 #7d99bf;
  -webkit-box-shadow: inset 0 1px 0 0 #7d99bf;
  -o-box-shadow: inset 0 1px 0 0 #7d99bf;
  box-shadow: inset 0 1px 0 0 #7d99bf;
  color: white;
  text-shadow: 0 1px 0 #2a4f83;
  /*behavior: url("./wp-content/themes/element/PIE.php");*/
  behavior: url("PIE.php");
  position: relative;
}
a.button.blue:hover {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #365a8c), color-stop(100%, #51719e));
  background-image: -webkit-linear-gradient(#365a8c, #51719e);
  background-image: -moz-linear-gradient(#365a8c, #51719e);
  background-image: -o-linear-gradient(#365a8c, #51719e);
  -pie-background: linear-gradient(#365a8c, #51719e);
  -moz-box-shadow: inset 0 1px 0 0 #728cb1;
  -webkit-box-shadow: inset 0 1px 0 0 #728cb1;
  -o-box-shadow: inset 0 1px 0 0 #728cb1;
  box-shadow: inset 0 1px 0 0 #728cb1;
  cursor: pointer;
}
a.button.blue:active {
  -moz-box-shadow: inset 0 0 8px 4px #335380, inset 0 0 8px 4px #335380, 0 1px 1px 0 #eeeeee;
  -webkit-box-shadow: inset 0 0 8px 4px #335380, inset 0 0 8px 4px #335380, 0 1px 1px 0 #eeeeee;
  -o-box-shadow: inset 0 0 8px 4px #335380, inset 0 0 8px 4px #335380, 0 1px 1px 0 #eeeeee;
  box-shadow: inset 0 0 8px 4px #335380, inset 0 0 8px 4px #335380, 0 1px 1px 0 #eeeeee;
  border: 1px solid #355a8d;
}
a.button.blue span.btn_caption {
  color: #9ab5da;
  text-shadow: 0 1px 0 #2a4f83;
}

/* @end */
/* @group Dark Blue  */
a.button.darkblue {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #3054a1), color-stop(100%, #1c3b7d));
  background-image: -webkit-linear-gradient(#3054a1, #1c3b7d);
  background-image: -moz-linear-gradient(#3054a1, #1c3b7d);
  background-image: -o-linear-gradient(#3054a1, #1c3b7d);
  -pie-background: linear-gradient(#3054a1, #1c3b7d);
  border: 1px solid #1d3d81;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -o-border-radius: 3px;
  -ms-border-radius: 3px;
  -khtml-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: inset 0 1px 0 0 #416ac3;
  -webkit-box-shadow: inset 0 1px 0 0 #416ac3;
  -o-box-shadow: inset 0 1px 0 0 #416ac3;
  box-shadow: inset 0 1px 0 0 #416ac3;
  color: white;
  text-shadow: 0 1px 0 #122c63;
  /*behavior: url("./wp-content/themes/element/PIE.php");*/
  behavior: url("PIE.php");
  position: relative;
}
a.button.darkblue:hover {
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #1a3570), color-stop(100%, #2e4b8a));
  background-image: -webkit-linear-gradient(#1a3570, #2e4b8a);
  background-image: -moz-linear-gradient(#1a3570, #2e4b8a);
  background-image: -o-linear-gradient(#1a3570, #2e4b8a);
  -pie-background: linear-gradient(#1a3570, #2e4b8a);
  -moz-box-shadow: inset 0 1px 0 0 #3e61ac;
  -webkit-box-shadow: inset 0 1px 0 0 #3e61ac;
  -o-box-shadow: inset 0 1px 0 0 #3e61ac;
  box-shadow: inset 0 1px 0 0 #3e61ac;
  cursor: pointer;
}
a.button.darkblue:active {
  -moz-box-shadow: inset 0 0 8px 4px #183063, inset 0 0 8px 4px #183063, 0 1px 1px 0 #eeeeee;
  -webkit-box-shadow: inset 0 0 8px 4px #183063, inset 0 0 8px 4px #183063, 0 1px 1px 0 #eeeeee;
  -o-box-shadow: inset 0 0 8px 4px #183063, inset 0 0 8px 4px #183063, 0 1px 1px 0 #eeeeee;
  box-shadow: inset 0 0 8px 4px #183063, inset 0 0 8px 4px #183063, 0 1px 1px 0 #eeeeee;
  border: 1px solid #193570;
}
a.button.darkblue span.btn_caption {
  color: #6087dc;
  text-shadow: 0 1px 0 #122c63;
}

/* @end */
/* End Button Styles */


/* ==|== non-semantic helper classes ========================================
   ========================================================================== */

/* For image replacement */
.ir { display: block; border: 0; text-indent: -999em; overflow: hidden; background-color: transparent; background-repeat: no-repeat; text-align: left; direction: ltr; }
.ir br { display: none; }

/* Hide from both screenreaders and browsers: h5bp.com/u */
.hidden { display: none !important; visibility: hidden; }

.visible {display:block;}

/* Hide only visually, but have it available for screenreaders: h5bp.com/v */
.visuallyhidden { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; }

/* Extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard: h5bp.com/p */
.visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { clip: auto; height: auto; margin: 0; overflow: visible; position: static; width: auto; }

/* Hide visually and from screenreaders, but maintain layout */
.invisible { visibility: hidden; }

/* Contain floats: h5bp.com/q */ 
.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }



/* ==|== media queries ======================================================
only screen and min-device-width
   ========================================================================== */
   
/* iPads (portrait and landscape) ----------- */
@media only screen 
and (min-width : 768px) 
and (max-width : 1024px) {
#container, #colophon{width:98%;}

.flexslider {width:94%;}

#secondary-navigation ul li a{padding:15px;}
}

/* large smartphones ----------- */
@media  (max-width: 768px) {
#container, #colophon{width:98%;}

header{padding:10px 0 1px 0;}
header h1{ font-size:2.6em;}
header h2{ font-size:1.6em;}

.flexslider {width:92%;}

.sf-menu li.sfHover ul {top:-999em;}
.sf-sub-indicator {	background:none;}

#secondary-navigation ul li a{padding:15px;}

#main h1{font-size:1.6em;}
#main h2{font-size:1.4em;}
#main h3{font-size:1.3em;}
#main h4{font-size:1.2em;}
}

/* medium smartphones ----------- */
@media (max-width: 600px) {
.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	margin-left: 0.83333333333333%;
	margin-right: 0.83333333333333%;
	width: 48.333333333333%;

}	
}

/* medium smartphones ----------- */
@media (max-width: 480px) {
#container, #colophon{width:94%;}

#logo, header hgroup{ width:100%; text-align:center;}
#logo img{max-width:100%;}

header h1{ font-size:1.8em;}
header h2{ font-size:1.2em;}

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12 {
	margin-left: 0;
	margin-right: 0;
	width:100%;
}
#topnav{ display:block; width:100%; text-align:center; background:#aaccec; padding:15px 0; margin:15px 0; border-radius:7px;}
#mobileMenu_mobileselect { display:block; width:90%; margin:auto; height:1.6em;}

footer .grid_4{ border-bottom:1px dotted #ccc; padding-bottom:10px;}
}

/* medium smartphones, portrait ----------- */
@media (max-width: 320px) {

}



/* ==|== print styles =======================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */
 
@media print {
  * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } /* Black prints faster: h5bp.com/s */
  a, a:visited { text-decoration: underline; }
  a[href]:after { content: " (" attr(href) ")"; }
  abbr[title]:after { content: " (" attr(title) ")"; }
  .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; }  /* Don't show links for images, or javascript/internal links */
  pre, blockquote { border: 1px solid #999; page-break-inside: avoid; }
  thead { display: table-header-group; } /* h5bp.com/t */
  tr, img { page-break-inside: avoid; }
  img { max-width: 100% !important; }
  @page { margin: 0.5cm; }
  p, h2, h3 { orphans: 3; widows: 3; }
  h2, h3 { page-break-after: avoid; }
}
