/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* BODY FRAME
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

/* Body --------------------------------------------------------------------------*/
body							{background:#e0eaf0;}
.wrapper_body                   {margin-top:150px;}
.has_vertnav .wrapper_body		{margin-top:100px;}
#frame_wrapper,#main_nav>div,#logo_app{width:100%; max-width:1418px; min-width:780px; margin:0px auto; overflow:hidden;}
#body_wrapper					{background:url('images/body_bkg_rpt.png') 0 291px repeat-x #e0eaf0; overflow:hidden;}
#body_wrapper.has_vertnav		{background-position:0 241px;}
@media print {
    #body_wrapper {
        display:none;
    }
    #wrapper_hd {
        display:none;
    }
    #ft {
        display:none;
    }
    .wrapper_body {
        margin-top: 0px;
    }
}
/* Header / Slideshow ------------------------------------------------------------*/
#wrapper_hd						{position:absolute; top:0; left:0; margin:0 auto; width:100%; }
#header-image					{position:relative; background:url(images/hdslides/1.jpg) center 0 no-repeat #426281; border-bottom:7px solid #27445f; min-height:291px; width:100%; overflow:hidden;} /* took out: overflow:hidden; */
.has_vertnav #header-image		{min-height:241px;}
#wrapper_hd, * html #header-image, .has_vertnav #wrapper_hd, * html .has_vertnav #header-image { height:291px; }

#logo_app						{margin-top:130px; text-align:left;}
#logo_app a, #logo_app a:hover	{font-size:30px; color:#fff; font-weight:bold; text-decoration:none; line-height:.8em; padding:0 15px;}

/* Frame */
#frame_wrapper					{position:relative; padding-top:50px;}
	#frame_header_wrap			{overflow:hidden; height:46px; position:absolute; top:45px; left:0; width:100%;}
		#frame_header			{background:url('images/frame/hd-bkg.png') 50% 0 no-repeat; height:46px; margin:0 12px;}
	#frame_seal					{height:135px; width:150px; position:absolute; top:0px; left:50%; margin-left:-75px;}
		#frame_seal.coj			{background:url('images/frame/coj-seal.png') 50% -10px no-repeat;}
		#frame_seal.council		{background:url('images/frame/coj-council-seal.png') 50% -10px no-repeat;}
		#frame_seal.jso			{background:url('images/frame/jso-badge.png') 50% -10px no-repeat;}
		#frame_seal a			{display:block; margin:10px 20px 0; text-indent:-9999px; height:105px;}
	#outer_content_wrap			{margin:0px 12px 0; padding-top:28px; border-left:1px solid #c2d0db; border-right:1px solid #c2d0db; overflow:hidden; background:#f6fcfe;}
	/* Side border strips w/ fade to trans with side shadow */
	.frame_border				{width:12px; height:417px;}
	.frame_border.left,.frame_border.right{display:block; float:none; clear:both; position:absolute;}
	.frame_border.left			{background:url('images/frame/side-gradient-l.png') no-repeat; top:45px; left:0px;}
	.frame_border.right			{background:url('images/frame/side-gradient-r.png') no-repeat; top:45px; right:0px;}

/* MAIN NAV ----------------------------------------------------------------------*/

#wrapper_nav					{position:absolute; top:50px; width:100%; z-index:3;}
#main_nav						{z-index:4;}
#main_nav>div					{overflow:visible;}

.hzMenu							{font-size:13px;}
.hzMenu *						{z-index:200 !important;}
/* Any Menu Item */
.hzMenu a						{padding:5px 15px !important; }
/*1st Level links only */
.hzMenu>ul>li>a					{color:#dff2fb; padding-bottom:8px !important; border-top:3px solid transparent !important; border-left:1px solid transparent !important; text-transform:uppercase; font-family:Georgia, "Times New Roman", Serif;}
.hzMenu>ul>li>a.highlighted,.hzMenu>ul>li>a.selected {background:#f6fcfe; color:#334d65 !important; border-top:3px solid #e3b435 !important;}

/*Any UL under 1st level */
.hzMenu>ul>li ul				{position:absolute !important; z-index:99999 !important; line-height:1.4em; font-size:14px; min-width:150px; border-left:1px solid #cddce0; border-right:1px solid #cddce0; background:url('images/shadow-top.png') 50% 0 no-repeat #f6fcfe; border-bottom:3px solid #e3b435 !important;}
.hzMenu>ul>li ul a				{border-top:1px dotted #cddce0 !important;}
.hzMenu>ul>li ul a:hover		{background:#ebf6fa;}
.hzMenu>ul>li ul a.highlighted	{background-color:#ebf6fa !important;}

/* SUB NAV -----------------------------------------------------------------------*/
#sub_nav						{}
#sub_nav_innerwrap				{background:url('images/vert_nav/bkg.png') 30% 0 no-repeat #eaf2f6;}
#sub_nav_borderwrap				{background:url('images/vert_nav/shadow-rpt.png') 100% 0 repeat-y; overflow:hidden;}
#sub_nav_hd						{background:url('images/sidebar/gradient-header.png') 50% 0 no-repeat; height:45px;}
#sub_nav_ft						{background:url('images/vert_nav/gradient-footer.png') 100% 0 no-repeat; height:50px;}
#sub_nav .grid_content			{padding:0 7px !important; margin:0;}
/* Vertical Menu */
#sub_nav .VrtMenu, .VrtMenu ul	{width:100% !important;}
.VrtMenu a						{white-space:normal !important;}
/* Generic OL/UL List */
#sub_nav ol, #sub_nav ul		{margin:0; padding-left:0; border-top:1px dotted #cddce0; margin-bottom:30px;}
#sub_nav li						{list-style-type:none; line-height:1em; border-bottom:1px dotted #cddce0;}
#sub_nav ol a, #sub_nav ul a	{display:block; padding:6px 2px 5px 8px;}
#sub_nav ol a, #sub_nav ul a, #sub_nav a:hover	{text-decoration:none;}

/* TREEVIEW ----------------------------------------------------------------------*/
.tvMenu table, .tvMenu tr, .tvMenu td {padding:0; margin:0; line-height:1em;}
.tvMenu table tr				{border-bottom:0px dotted #cddce0 !important;} /* works IE8 only */
/* All Items */
.tvMenu_node					{width:100%;}
.tvMenu_node a					{display:block; padding:3px 0; line-height:1.4em; border-bottom:1px dotted #cddce0 !important; white-space:normal !important;}
/* Any item with Children */
.tvMenu_parentNode				{font-weight:bold;}

/* SIDEBAR -----------------------------------------------------------------------*/
#sidebar						{}

/* BREADCRUMBS / SEARCH */
#breadcrumbs					{display:none; overflow:hidden; padding:40px 0 15px 0;}
.has_breadcrumbs #breadcrumbs	{display:block;}

#content						{padding-top:40px;}
.has_breadcrumbs #content		{padding-top:0px;}

.has_breadcrumbs #bd			{background:url('images/breadcrumbs_bkg.png') 100% -80px no-repeat; overflow:hidden;}
.frontpage #bd, .nobc #bd		{background:transparent !important;}

/* CONTENT ---------------------------------------------------------------------- */
#content						{}

/* Bottom */
#content-ft						{}

/* FOOTER ------------------------------------------------------------------------*/
#ft								{background:#ebf6fa; margin-top:20px; padding-bottom:10px; border-top:1px solid #e9f4f7; border-bottom:#c2d0db 1px solid; padding-top:10px; overflow:hidden;}
#logo_itd						{height:35px;}
#link_logo_itd					{float:right; width:110px; height:35px; background:transparent url('images/logo_itd.png') 0 0 no-repeat;}
#ft #version					{text-align:right; padding-right:20px; line-height:1em; color:#888;}

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* BODY/CONTENT STYLES
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

/*  ------------------------------------------------------------------*/

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
* Controls
* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

/* Gridview */
table.gridview					{width:100%; border-collapse:collapse; border:0px;}
.gridview th					{font-weight:bold; border-bottom: 2px solid #c0cdd7; padding:3px 3px 2px 3px; text-align:left;}
.gridview th a					{}
.gridview th a:hover			{}
.gridview td					{padding:3px; border-bottom:1px solid #dbe4ea;}
.gridview tr.alt				{background:url('images/controls/gridview/alt-bkg.png') 0 0 repeat;}
.gridview tr.pager				{background:transparent;}
.gridview .pager table			{float:right !important; width:auto !important; margin:1em 0 0 0;}
.gridview tr.pager td			{border:0px; margin:0; padding:0 3px;}
	.pager td a					{background:#d5e0e9; color:#8a9eb0; font-weight:normal;}
	.pager td a:hover			{color:#000 !important; font-weight:bold;}
	.pager td span				{border:1px solid #fff; border-left:1px solid #ccc; border-top:1px solid #ccc;}
	.pager td a,.pager td span	{display:block; padding:3px 5px; line-height:1em; text-decoration:none;}
.gridview .sort-asc a			{padding-right:10px; background:url('images/controls/gridview/sort-asc.png') 100% 50% no-repeat;}
.gridview .sort-dec a			{padding-right:10px; background:url('images/controls/gridview/sort-dec.png') 100% 50% no-repeat;}

.gridview.autowidth             {width:auto !important;}
.nowrap							{white-space:nowrap !important;}

/* Date Picker ------------------------------------------------------------------*/

/* dtp Textbox Style - creates a little calendar icon instead of a text link for "Choose date" */
a.dp-choose-date						{ float: left; width: 16px; height: 16px; padding: 0; margin: 0px 0 0 3px; display: block; text-indent: -2000px; overflow: hidden; background: url('images/controls/datepicker/calendar.png') no-repeat; }
a.dp-choose-date.dp-disabled			{ background-position: 0 -20px; cursor: default; }
/* makes the input field shorter once the date picker code
 * has run (to allow space for the calendar icon)
 */
input.dp-applied						{ width: 70px !important; float: left; }

/* Calendar Style
---------------------------------------------------------------------------------*/
table.jCalendar							{ border: 0px solid #000; background: #BFDEF1; border-collapse: separate; border-spacing: 2px; margin:0; line-height:1em;}
table.jCalendar th						{ background: #BFDEF1; color: #0095BC; font-weight: bold; padding: 4px 6px; }
table.jCalendar td						{ background: #B0D8EF; color: #000; padding: 4px 6px; text-align: center; }
table.jCalendar td.other-month			{ background: #ABD1E6; color: #000; }
table.jCalendar td.today				{ background: #DAE8F4; color: #005882; font-weight: bold; }
table.jCalendar td.selected				{ background: #FFE6BD; color: #005882; font-weight: bold; }
table.jCalendar td.selected:hover		{ background: #FFE6BD; color: #fff; }
table.jCalendar td:hover, table.jCalendar td.dp-hover
										{ background: #DAE8F4; color: #000; }
table.jCalendar td.disabled, table.jCalendar td.disabled:hover
										{ background: #ABD1E6; color: #888; }

/* For the popup */
/* NOTE - you will probably want to style a.dp-choose-date */
div#dp-popup							{ line-height:0em; position: absolute; font-family: arial, sans-serif; background: #DAE8F4; padding: 2px; min-height: 172px; min-width: 171px; border: 1px solid #5EA9D7; z-index:5; }
div#dp-popup h2							{ font-size: 13px; text-align: center; margin: 3px 0 !important; padding: 2px 0 !important; }
a#dp-close								{ font-size: 11px; padding: 4px 0; text-align: center; display: block; }
a#dp-close:hover						{ text-decoration: underline; }
div#dp-popup a							{ color: #000; text-decoration: none; padding: 3px 2px 0; }
div#dp-popup div.dp-nav-prev			{ position: absolute; top: 2px; left: 4px; width: 50px; }
div#dp-popup div.dp-nav-prev a			{ float: left; }
/* bkg images */
div#dp-popup div.dp-nav-prev a, div#dp-popup div.dp-nav-next a	{ width:16px; height:16px; text-indent:-9999px; background:url('images/controls/datepicker/dtp-nav.png') 0 0 no-repeat; }
div#dp-popup div.dp-nav-prev a.dp-nav-prev-year					{ background-position:0 0; }
div#dp-popup div.dp-nav-prev a.dp-nav-prev-year.disabled		{ background-position:0 -20px; }
div#dp-popup div.dp-nav-prev a.dp-nav-prev-month				{ background-position:-20px 0; }
div#dp-popup div.dp-nav-prev a.dp-nav-prev-month.disabled		{ background-position:-20px -20px; }
div#dp-popup div.dp-nav-next a.dp-nav-next-year					{ background-position:-40px 0; }
div#dp-popup div.dp-nav-next a.dp-nav-next-year.disabled		{ background-position:-40px -20px; }
div#dp-popup div.dp-nav-next a.dp-nav-next-month				{ background-position:-60px 0; }
div#dp-popup div.dp-nav-next a.dp-nav-next-month.disabled		{ background-position:-60px -20px; }
/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
div#dp-popup div.dp-nav-prev a, div#dp-popup div.dp-nav-next a	{ cursor: pointer; }
div#dp-popup div.dp-nav-prev a.disabled, div#dp-popup div.dp-nav-next a.disabled
																{ cursor: default; }
div#dp-popup div.dp-nav-next									{ position: absolute; top: 2px; right: 4px; width: 100px; }
div#dp-popup div.dp-nav-next a									{ float: right; }
div#dp-popup a.disabled											{ cursor: default; color: #aaa; }
div#dp-popup td													{ cursor: pointer; }
div#dp-popup td.disabled										{ cursor: default; }

/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *
 * @media queries only for for CSS3 complient browsers.
 * EG: Safari 4+, Firfox 3.6+, Chrome, MobileSafari, etc.
 * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

/* Wide Screens */
@media screen and (min-width: 1200px) {
	#content	{/* font-size:1.2em; */}
}

/* Mobile Rules for 600px MAX WIDTH Devices */
@media screen and (max-device-width: 480px), screen and (max-width: 700px) {
    #frame_header						{background-image:url('images/frame/m-hd-bkg.png');}
}
@media screen and (max-device-width: 480px), screen and (max-width: 800px) {
/* Switch to a linear format; No floats for key elements */
.mblock, #main_nav.mblock li		{width:100% !important; display:block !important; float:none; clear:both;}
.monly								{display:block !important;}

/* Hide any extraneous bits */
.mhide								{display:none;}

/* Clear Background / Images (no load) */
.mtrans								{background:transparent !important}

/* Specifics ****************************************************** */
#frame_wrapper, #main_nav > div, #logo_app
									{min-width:200px !important; width:100% !important;}
#content							{}
#sidebar							{}

/* Sub Nav */
#sub_nav.mblock						{width:100% !important; display:block !important;}

#logo_app							{margin-top:0px; position:relative;}
#body_wrapper						{background-position:0 0;}

/* Navigation ***************************************************** */
#wrapper_nav						{position:static !important; margin-top:0; }
#wrapper_hd							{top:auto; left:auto;}
#main_nav							{background:transparent;}

/* Vertical Menu that replaces horizontal menu */
.VrtMenu.mobilenav					{}
.VrtMenu.mobilenav, .VrtMenu.mobilenav ul
									{width:100% !important;}
.VrtMenu a							{white-space:normal !important;}
/* Generic OL/UL List */
.VrtMenu.mobilenav ol, .VrtMenu.mobilenav ul
									{margin:0; padding-left:0; border-top:1px dotted #cddce0; margin-bottom:30px;}
.VrtMenu.mobilenav li				{list-style-type:none; line-height:1em; border-bottom:1px dotted #cddce0;}
.VrtMenu.mobilenav ol a, .VrtMenu.mobilenav ul a
									{display:block; padding:6px 2px 5px 8px;}
.VrtMenu.mobilenav ol a, .VrtMenu.mobilenav ul a, .VrtMenu.mobilenav a:hover
									{text-decoration:none;}

#ft									{}
#ft li								{line-height:1.1em; border-bottom:1px dashed #d2e1e8; padding:0; margin:0;}
#ft li a							{font-size:12px; padding:7px 0; display:block; line-height:1em;}
}