/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
body { background-color: #5c87b2; font-size: .85em; font-family: tahoma, "Trebuchet MS" , Verdana, Helvetica, Sans-Serif; margin: 0; padding: 0; color: #000; font-size: 9pt; }
a { color: #034af3; text-decoration: none; }
a:link { color: #034af3; text-decoration: none; }
a:hover { color: #1d60ff; text-decoration: none; }
a:active { color: #12eb87; }
p, ul { margin-bottom: 20px; line-height: 1.6em; }
header, footer, nav, section { display: block; }

/* HEADINGS   
----------------------------------------------------------*/
h1, h2, h3, h4, h5, h6 { font-size: 1.5em; color: #000; }
h1 { font-size: 2em; padding-bottom: 0; margin-bottom: 0; }
h2 { padding: 0 0 5px 0; }
h3 { font-size: 1.2em; }
h4 { font-size: 1.1em; }
h5, h6 { font-size: 1em; }

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/
/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.page { width: 90%; margin-left: auto; margin-right: auto; }
header, #header { position: relative; margin-bottom: 0px; color: #000; padding: 0; }
header h1, #header h1 { font-weight: bold; padding: 5px 0; margin: 0; color: #fff; border: none; line-height: 2em; font-size: 32px !important; text-shadow: 1px 1px 2px #111; }
#main { padding: 20px 30px 15px 30px; background-color: #fff; border-radius: 4px 0 0 0; -webkit-border-radius: 4px 0 0 0; -moz-border-radius: 4px 0 0 0; direction: rtl; text-align: right; }
#main h2 { font-family: Arial; font-size: 22px; }
footer, #footer { background-color: #fff; color: #999; padding: 10px 0; text-align: center; line-height: normal; margin: 0 0 30px 0; font-size: .9em; border-radius: 0 0 4px 4px; -webkit-border-radius: 0 0 4px 4px; -moz-border-radius: 0 0 4px 4px; }

/* TAB MENU   
----------------------------------------------------------*/
ul.menu { border-bottom: 1px #5C87B2 solid; padding: 0 0 2px; position: relative; margin: 0; text-align: right; direction: rtl; }
ul.menu li { display: inline; list-style: none; }
ul.menu li#greeting { padding: 10px 20px; font-weight: bold; text-decoration: none; line-height: 2.8em; color: #fff; }
ul.menu li a { padding: 10px 20px; font-weight: bold; text-decoration: none; line-height: 2.8em; background-color: #e8eef4; color: #034af3; border-radius: 4px 4px 0 0; -webkit-border-radius: 4px 4px 0 0; -moz-border-radius: 4px 4px 0 0; }
ul.menu li a:hover { background-color: #fff; text-decoration: none; }
ul.menu li a:active { background-color: #a6e2a6; text-decoration: none; }
ul.menu li.selected a { background-color: #fff; color: #000; }

/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/
fieldset { border: 1px solid #ddd; padding: 0 1.4em 1.4em 1.4em; margin: 0 0 1.5em 0; }
legend { font-size: 1.2em; font-weight: bold; }
textarea { min-height: 150px; border: 1px solid #ccc; padding: 3px; font-size: 1.2em; color: #444; width: 400px; font-size: 12pt; }
input[type="text"], input[type="password"] { border: 1px solid #ccc; padding: 3px; font-size: 1.2em; color: #444; width: 400px; font-size: 12pt; }
select { border: 1px solid #ccc; padding: 2px; font-size: 1.2em; color: #444; }
input[type="submit"] { font-size: 1.2em; padding: 0 20px; }

/* TABLE
----------------------------------------------------------*/
.grid { border-collapse: collapse; line-height: 220%; }
.grid td { padding: 5px; text-align: center; border-bottom: 1px solid #c1cdd8; }
.grid th { padding: 5px 15px; text-align: center; background-color: #CDE4FF; color: #053799; font-weight: normal; border-bottom: 1px solid #91C6FF; }
.grid .even { }
.grid .odd { background-color: #F4F4F4; }
.details { border-collapse: collapse; line-height: 220%; }
.details td { padding: 5px; text-align: right; border-bottom: 1px solid #c1cdd8; width: 500px; }
.details th { padding: 5px 10px 5px 20px; text-align: right; background-color: #CDE4FF; color: #053799; font-weight: normal; border-bottom: 1px solid #91C6FF; }
.details .even { }
.details .odd { background-color: #F4F4F4; }
.click th { padding: 5px 10px; }
.user-agent { width: 450px; overflow-x: scroll; white-space: nowrap; direction: ltr; }

/* MISC  
----------------------------------------------------------*/
.clear { clear: both; }
.error { color: Red; }
nav, #menucontainer { margin-top: 20px; }
div#title { display: block; float: right; text-align: right; font-family: Arial; }
#logindisplay { font-size: 1.1em; display: block; text-align: left; margin: 10px; color: White; direction: rtl; }
#logindisplay a:link { color: white; text-decoration: none; }
#logindisplay a:visited { color: white; text-decoration: none; }
#logindisplay a:hover { color: white; text-decoration: none; }

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error { color: #ff0000; }
.field-validation-valid { display: none; }
.input-validation-error { border: 1px solid #ff0000; background-color: #ffeeee; }
.validation-summary-errors { font-weight: bold; color: #ff0000; }
.validation-summary-valid { display: none; }

/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label, .editor-label { margin: 1em 0 0 0; }
.display-field, .editor-field { margin: 0.5em 0 0 0; }
.text-box { }
.text-box.multi-line { }
.tri-state { width: 6em; }
.expire { padding: 4px; background-color: #ffbf8b; }
.expired { padding: 3px; background-color: Red; color: White; }
.expire-soon { padding: 4px; background-color: Yellow; }
.search-click { color: #4572A7; font-size: 17pt; }
.beneficial-click { color: #89A54E; font-size: 17pt; }
.nobeneficial-click { color: #AA4643; font-size: 17pt; }


/* Default styling for jQuery Calendars Picker
----------------------------------------------------------*/
.calendars { background-color: #fff; color: #000; border: 1px solid #444; border-radius: 0.25em; -moz-border-radius: 0.25em; -webkit-border-radius: 0.25em; font-family: tahoma; font-size: 90%; }
.calendars-rtl { direction: rtl; }
.calendars-popup { z-index: 1000; }
.calendars-disable { position: absolute; z-index: 100; background-color: white; opacity: 0.5; filter: alpha(opacity=50); }
.calendars a { color: #fff; text-decoration: none; }
.calendars a.calendars-disabled { color: #888; cursor: auto; }
.calendars button { margin: 0.25em; padding: 0.125em 0em; background-color: #fcc; border: none; border-radius: 0.25em; -moz-border-radius: 0.25em; -webkit-border-radius: 0.25em; }
.calendars-nav, .calendars-ctrl { float: left; width: 100%; background-color: #5c87b2; color: #fff; font-size: 90%; }
.calendars-ctrl { background-color: #600; }
.calendars-cmd { width: 30%; }
.calendars-cmd:hover { background-color: #777; }
.calendars-ctrl .calendars-cmd:hover { background-color: #f08080; }
.calendars-cmd-prevJump, .calendars-cmd-nextJump { width: 8%; }
a.calendars-cmd { height: 1.5em; }
button.calendars-cmd { text-align: center; }
.calendars-cmd-prev, .calendars-cmd-prevJump, .calendars-cmd-clear { float: left; padding-left: 2%; }
.calendars-cmd-current, .calendars-cmd-today { float: left; width: 35%; text-align: center; }
.calendars-cmd-next, .calendars-cmd-nextJump, .calendars-cmd-close { float: right; padding-right: 2%; text-align: right; }
.calendars-rtl .calendars-cmd-prev, .calendars-rtl .calendars-cmd-prevJump, .calendars-rtl .calendars-cmd-clear { float: right; padding-left: 0%; padding-right: 2%; text-align: right; }
.calendars-rtl .calendars-cmd-current, .calendars-rtl .calendars-cmd-today { float: right; }
.calendars-rtl .calendars-cmd-next, .calendars-rtl .calendars-cmd-nextJump, .calendars-rtl .calendars-cmd-close { float: left; padding-left: 2%; padding-right: 0%; text-align: left; }
.calendars-month-nav { float: left; background-color: #777; text-align: center; }
.calendars-month-nav div { float: left; width: 12.5%; margin: 1%; padding: 1%; }
.calendars-month-nav span { color: #888; }
.calendars-month-row { clear: left; }
.calendars-month { float: left; width: 15em; border: 1px solid #444; text-align: center; }
.calendars-month-header, .calendars-month-header select, .calendars-month-header input { height: 2.0em; background-color: #749ec9; color: #fff;}
.calendars-month-header select, .calendars-month-header input { height: 1.7em; border: none; }
.calendars-month-header input { position: absolute; display: none; }
.calendars-month table { width: 100%; border-collapse: collapse; }
.calendars-month thead { border-bottom: 1px solid #9ea7b2; }
.calendars-month th, .calendars-month td { margin: 0em; padding: 0em; font-weight: normal; text-align: center; }
.calendars-month th { border: 1px solid #777; }
.calendars-month th, .calendars-month th a { background-color: #777; color: #fff; }
.calendars-month td { background-color: #eee; border: 1px solid #aaa; }
.calendars-month td.calendars-week { border: 1px solid #777; }
.calendars-month td.calendars-week * { background-color: #777; color: #fff; border: none; }
.calendars-month a { display: block; width: 100%; padding: 0.125em 0em; background-color: #eee; color: #000; text-decoration: none; }
.calendars-month span { display: block; width: 100%; padding: 0.125em 0em; }
.calendars-month td span { color: #888; }
.calendars-month td .calendars-other-month { background-color: #fff; }
.calendars-month td .calendars-weekend { background-color: #ddd; }
.calendars-month td .calendars-today { background-color: #f0c0c0; }
.calendars-month td .calendars-highlight { background-color: #f08080; }
.calendars-month td .calendars-selected { background-color: #777; color: #fff; }
.calendars-month th.calendars-week { background-color: #777; color: #fff; }
.calendars-status { clear: both; background-color: #ddd; text-align: center; }
.calendars-clear-fix { clear: both; }
.calendars-cover { display: none; display: /**/ block; position: absolute; z-index: -1; filter: mask(); top: -1px; left: -1px; width: 100px; height: 100px; }