/*
	This css document includes styles for separate page elements:
	- hypernavigation bar 
	- tabs 
	- buttons
	in 
*/


#DeleteContTooltip .x-tip-header { margin-left: 40px; }
#DeleteContTooltip .x-tip-body { background: url("../img/icons/icon-info.gif") no-repeat scroll 0 0 transparent; padding-left: 40px; }

/*** HYPERNAVIGATION *************/
#hypernavigation { margin: 5px auto 3px auto; width:883px; clear:both; color: #663B8A; font: normal 9pt Arial, Helvetica, sans-serif; border-collapse:collapse;}
#hypernavigation td { padding:0; vertical-align:top; height: 31px;}
#hypernavigation a { color: #663B8A; text-decoration:none; float:left; padding: 5px; }
#hypernavigation a:hover { color: #000; background: #CCCCCC; }
#hypernavigation a.active { font-weight:bold; }
#hypernavigation ul { margin:0; padding:0; }
#hypernavigation li { float:left; margin: 0; padding:0; }
#hypernavigation li a { float:left; padding: 8px 5px 0 5px; height:23px; }

#hypernavigation .back { width:auto; background:url(../img/navigation/navigation-bar-l.png) left top no-repeat; width:72px; }
#hypernavigation .back a { float:left; padding:8px 5px 0 32px; height:23px; background:url(../img/navigation/navigation-l.png) left top no-repeat; }
#hypernavigation .back a:hover { background:url(../img/navigation/navigation-l.png) left bottom no-repeat; font-weight:bold; text-decoration:underline; }

/* check if used anywhere
#hypernavigation .start { width:29px; }
#hypernavigation .start a { display:block; height:31px; padding:0; width:29px; background-image:url(../img/navigation/navigation-e.gif); background-position:left top; background-repeat:no-repeat; }
#hypernavigation .start a:hover { background-image:url(../img/navigation/navigation-e.gif); background-position:left bottom; }
*/

#hypernavigation .bar { background:url(../img/navigation/navigation-bg-r.png) left top repeat-x;  }

#hypernavigation .bar-left { float:left; background:url(../img/navigation/navigation-bar-l.png) right top no-repeat; height:31px; padding-right:15px; }
#hypernavigation .bar-left li { padding: 8px 5px 2px 5px; color: #663B8A; }
/* The width hack below is required as IE6 doesn't support max-width. Browsers other than IE will ignore it. */
#hypernavigation .bar-left li b { max-width: 230px; overflow:hidden; white-space:nowrap; width: expression(this.clientWidth > 220 ? '220px' : true); }
#hypernavigation .bar-left { float:left; background:url(../img/navigation/navigation-bar-l.png) right top no-repeat; height:31px; padding-right:15px; }
#hypernavigation .bar-left li a:hover { background:url(../img/navigation/navigation-l-hover.gif) left top repeat-x; text-decoration:underline; }
#hypernavigation .bar-left .bar-separator { margin: 1px 5px; padding:0; width:0; height: 29px; border-left: 1px solid #AB9BB7; border-right: 1px solid #E0E0E0; }


#hypernavigation .bar-right { background:url(../img/navigation/navigation-bg-r.png) left top repeat-x; max-height:31px; overflow:hidden; }
#hypernavigation .bar-right .bar-separator { background-image:url(../img/navigation/navigation-separator-r.png); margin-left: 5px; }
#hypernavigation .bar-right li a:hover { background:url(../img/navigation/navigation-r-hover.gif) left top repeat-x; text-decoration:underline; }

#hypernavigation .bar-right-end { width:10px; background:url(../img/navigation/navigation-r.png) right top no-repeat; }

#hypernavigation .bar-separator { float:left; width:2px; height:14px; padding:0; margin-top: 9px; margin-right: 5px; margin-bottom:0; background-repeat:no-repeat; background-position:center top; }
/*********************************/

/* EVENT ICONS */
.bar-icons { background: url(../img/navigation/navigation-bg-r.png) left top repeat-x; width: 105px; }
.bar-icons .bar-icons-split { background: url(../img/navigation/navigation-r.png) left top no-repeat; width: 10px; height: 31px; float:right; }

#hypernavigation .bar-icons .bar-right { float:right; background: #fff; }
#hypernavigation .bar-icons .icons-events-bulk .icons-events-img { background: url(../img/icons/events-bar-alert.gif) right top no-repeat; }
#hypernavigation .bar-icons .icons-events-down .icons-events-img { background: url(../img/icons/events-bar-download.gif) right top no-repeat; }
#hypernavigation .bar-icons .icons-events-img {padding-right: 15px; height: 17px; display:inline-block; vertical-align:middle; cursor:pointer; }

#hypernavigation .EXTeventinfo { margin-left: 4px; text-align: center; position:relative; color: #fff; font-weight: bold; background: url(../img/navigation/event-bg.gif) left top no-repeat; width: 32px; }
#hypernavigation .EXTeventinfo:hover { text-decoration: none !important; color: #fff; background: url(../img/navigation/event-bg-hover.gif) left top no-repeat !important; } 
#hypernavigation .EXTeventinfo-pulse { background-image: url(../img/navigation/event-bg-ani.gif); }

/*** SUBNAV **********************/
.subnav { width:883px; height:25px; padding:0; margin:2px auto 5px auto; background:url(../img/navigation/subnav.gif) left top no-repeat; font: 9pt Arial, Helvetica, sans-serif; }
.subnav div { float:left; background:url(../img/navigation/subnavbar-l-l.png) left top no-repeat; padding-left:3px; }
.subnav div span { float:left; padding: 5px 10px 0 5px; background: #DAD1E1 url(../img/navigation/subnavbar-l-r.png) right top no-repeat; height:20px; }  /* padding: 5px 5px; margin-bottom: 5px; */
.subnav ul { float:left; margin-left:5px; } 
.subnav ul li { float:left; margin-left:5px; padding-top: 5px; padding-bottom: 5px; } 
.subnav ul li a { text-decoration:none; color:#000; } 
.subnav ul li a.active { font-weight:bold; } 
.subnav ul li a:hover { text-decoration:underline; } 
/*********************************/

/*** APPNAV **********************/
.appnav { width:883px; height:34px; padding-top:3px; margin:2px auto 2px auto; background:url(../img/navigation/appnav.png) left top no-repeat; font: 9pt Arial, Helvetica, sans-serif; }
.appnav div { float:left; background:url(../img/icons/secure.gif) left top no-repeat; background-position: 8px 5px; padding-left:28px; padding-top:6px; }
.appnav div span { float:left; padding: 5px 10px 0 5px; background: #DAD1E1 url(../img/navigation/subnavbar-l-r.png) right top no-repeat; height:20px; }  /* padding: 5px 5px; margin-bottom: 5px; */
.appnav ul { float:left; margin-left:5px; } 
.appnav ul li { float:left; margin-left:5px; padding-top: 5px; padding-bottom: 5px; } 
.appnav ul li a { text-decoration:none; color:#000; } 
.appnav ul li a.active { font-weight:bold; } 
.appnav ul li a:hover { text-decoration:underline; } 
/*********************************/

/*** APPNAV-INFO **********************/
.appnav-info { width:883px; height:45px; padding-top:3px; margin:2px auto 2px auto; background:url(../img/navigation/appnav-info.png) left top no-repeat; font: 9pt Arial, Helvetica, sans-serif; }
.appnav-info div { float:left; height:45px; background:url(../img/icons/icon-info-trans.gif) left top no-repeat; background-position: 8px 12px; padding-left:28px; padding-top:6px; }
.appnav-info div span { float:left; padding: 5px 10px 0 5px; background: #DAD1E1 url(../img/navigation/subnavbar-l-r.png) right top no-repeat; height:20px; }  /* padding: 5px 5px; margin-bottom: 5px; */
.appnav-info ul { float:left; margin-left:5px; } 
.appnav-info ul li { float:left; margin-left:5px; padding-top: 5px; padding-bottom: 5px; } 
.appnav-info ul li a { text-decoration:none; color:#000; } 
.appnav-info ul li a.active { font-weight:bold; } 
.appnav-info ul li a:hover { text-decoration:underline; } 
/*********************************/



/*** STEPBAR *********************/
#stepbar { display:block; width:100%; clear:both; border-bottom:1px solid #633881; background: #E3D9EB; padding:0 !important; height:30px; }
#stepbar li { float:left; margin:0; height:30px; line-height:100% !important; background-position:left top; background-repeat: no-repeat; color:#633881; }
#stepbar li a, #stepbar li span { float:left; color:#633881; text-decoration:none; padding: 8px 0; }
#stepbar li a:hover { font-weight:bold; }
#stepbar .start { background-image:url(../img/navigation/stepbar-start.png); width: 20px; background-position:right top;}
#stepbar .inactive { background-image:url(../img/navigation/stepbar-inactive.png); width: 69px; background-position:right top;}
#stepbar .active { background:url(../img/navigation/stepbar-active.png) center right no-repeat; width: 110px; font-weight:bold; }

#stepbar .myButton { float: right; margin: 4px 5px 0 0; }
/*********************************/

/*** REF BOX *********************/
#refbox { margin: 0 0 5px 0; background: #FEFEFE; width: 100%; border-bottom: 1px solid #bbb; padding: 0; display:inline-block; }
#refbox h3 { padding: 10px; float:left;  }
#refbox button { float: right; margin: 5px 5px 0 0; min-width: 70px; }
#refbox #refdate { padding: 0; margin: 0; font-size: 12px; font-family: tahoma, Arial, Helvetica, sans-serif; float:left; }
#refbox #refdate li { margin: 10px; padding: 0 10px 0 0; float:left; }
#refbox #refdate #payExpressVarianceDiv { margin: 6px; padding: 0 10px 0 0; float:left; }
#refbox #refdate li strong { font-weight: bold; color: #623683; }
#refbox #refdate li strong input { color: #623683; width:30px; font-weight:bold; margin: -3px 5px 0 0; padding: 0 2px; position:relative;}
/*********************************/






/*** TABS ************************/
.tabs { height: 22px; padding:0 0 0 5px; background: 0; margin:0; position:relative; }
.tabs li { float:left; margin:0; padding:0; margin-left: 0px; }
.tabs li a { float:left; text-decoration:none; color: #474747; font-size: 8pt; position:relative; z-index: 1; outline: none; }
.tabs li a span { background-image:url(../img/sprites/sprite-tabs.gif); float:left; padding:0; margin:0; color: #474747; background-repeat:no-repeat; cursor:pointer; }
.tabs li a span.text { margin-top: 5px; background:0; }

.tabs li a span.left  { background-position: 0 -50px;  padding-left: 6px;  }
.tabs li a span.right { background-position: right -350px; padding-right: 6px; }
.tabs li a span.inner { background-position: 0 -200px; background-repeat: repeat-x; text-align:center; height:22px; }

.tabs li a:hover { z-index: 2; }
.tabs li a:hover span.left  { background-position: 0 -100px;  }
.tabs li a:hover span.right { background-position: right -400px; }
.tabs li a:hover span.inner { background-position: 0 -250px; }
	
.tabs li a.active { z-index: 10; }
.tabs li a.active span { font-weight:bold; }
.tabs li a.active span.left  { background-position: 0 0;  }
.tabs li a.active span.right { background-position: right -300px; }
.tabs li a.active span.inner { background-position: 0 -150px; height:23px;}

.tabs li.invalid a .left .right .inner .text { color: #E30000; padding-left: 18px; background: url("../extjs/resources/images/default/form/exclamation.gif") -1px -1px no-repeat; }


.tabs-red li a span { background-image:url(../img/sprites/sprite-tabs-red.gif); }
.tabs-purple li a span { background-image:url(../img/sprites/sprite-tabs-purple.gif); }
.tabs-grey li a span { background-image:url(../img/sprites/sprite-tabs-grey.gif); }
.tabs-grey li a span.text { margin-top:4px; }

.ext-ie6 .windowbox .tabs-grey li { border-bottom: 1px solid #fff;} /* IE8 */
* html .ext-ie6 .windowbox .tabs-grey li { border-bottom: none;}
/*********************************/



/*** BUTTON **********************/
.myButton { float:left; text-decoration:none; outline: none; position:relative;line-height: 1em;}
.myButton span { background-image:url(../img/sprites/sprite-btn.gif); float:left; padding:0; margin:0; background-repeat:no-repeat; cursor:pointer; color:#000;}
.myButton span.text { margin-top: 3px; background:0; font-size:11px; font-weight:bold; text-align:center;}
table .myButton span.text { margin-top: 4px; white-space: nowrap; }
.ext-ie6 .myButton span.text { margin-top: 4px; }


.myButton span.left  { background-position: 0 0 !important;  padding-left: 3px;  }
.myButton span.right { background-position: right -21px !important; padding-right: 3px; }
.myButton span.inner { background-position: 0 -42px !important; background-repeat: repeat-x; text-align:center; height:21px; padding:0 15px 0 16px;}
.myButton:hover {  z-index: 2; } /* for IE */

.myButton:hover span.left  { background-position: 0 -63px !important;  }
.myButton:hover span.right { background-position: right -84px !important; }
.myButton:hover span.inner { background-position: 0 -105px !important; }

.myButton:active span.left  { background-position: 0 -63px !important;  }
.myButton:active span.right { background-position: right -84px !important; }
.myButton:active span.inner { background-position: 0 -126px !important; }

.myButton span { background-image:url(../img/sprites/sprite-btn-purple.gif); color:#fff; }
.myButton-purple span { background-image:url(../img/sprites/sprite-btn-purple.gif); color:#fff; }
.myButton-red span { background-image:url(../img/sprites/sprite-btn-red.gif); color:#fff; }
.myButton-green span { background-image:url(../img/sprites/sprite-btn-green.gif); color:#fff; }


/* member landing light button */
.lightButton { float:right; text-decoration:none; outline: none; position:relative; line-height: 1em; }
.lightButton span { background-image:url(../img/sprites/member-button.png); float:left; padding:0; margin:0; background-repeat:no-repeat; cursor:pointer; color:#53306D; }
.lightButton span.text { margin-top: 6px; background:0; font-size:12px; font-weight:bold; text-align:center;}
.ext-ie6 .lightButton span.text { margin-top: 6px; }

.lightButton span.left  { background-position: 0 0 !important;  padding-left: 6px;  }
.lightButton span.right { background-position: right -26px !important; padding-right: 6px; }
.lightButton span.inner { background-position: 0 -52px !important; background-repeat: repeat-x; text-align:center; height:26px; padding:0 15px 0 16px;}
.lightButton:hover {  z-index: 2; } /* for IE */
.lightButton:hover span.left  { background-position: 0 -78px !important;  }
.lightButton:hover span.right { background-position: right -104px !important; }
.lightButton:hover span.inner { background-position: 0 -130px !important; }

/*********************************/


/*** WINDOW BOXES ****************/		
.windowbox { border-collapse:collapse; margin:0 10px 10px 10px; font-size:8pt;	}
	.windowbox .l, .windowbox .r { width: 6px; }
.summaryData .windowbox .head td { height: 25px; }
.windowbox .head td { background-image:url(../img/windowbox/top.gif); background-repeat:no-repeat; color: #fff; height:31px; }
	.windowbox .head .l { background-position: right top; }
	.windowbox .head .m { background-position: 0 bottom; background-repeat: repeat-x; padding: 0 0 0 5px; }
	.windowbox .head .r { background-position: left -31px;  }
	
.windowbox .foot td { background-image:url(../img/windowbox/bottom.gif); background-repeat:no-repeat; height:6px; font-size:0;}
	.windowbox .foot .l { background-position: 0 0; }
	.windowbox .foot .m { background-position: 0 bottom; background-repeat: repeat-x;  }
	.windowbox .foot .r { background-position: -1px -6px; }
	
.windowbox .midd { vertical-align:top; }
	.windowbox .midd .l, .windowbox .midd .r { background-image:url(../img/windowbox/midd.gif); background-repeat:repeat-y; width:6px; font-size:0; }
	.windowbox .midd .l { background-position: left; }
	.windowbox .midd .m { background:#FFF; }
	.windowbox .midd .r { background-position: right;  }
	

.windowbox table.static_display { border-collapse:collapse; color: #53306D; width:100%;}
.windowbox table.static_display td { padding: 5px; vertical-align:top}
.windowbox table.static_display thead th { background: #ABABAB; color:#fff; padding:5px; font-weight:bold;  }

.windowbox table.static_display .pale td { background:#EFEAF3; }
.windowbox table.static_display .left {background-position:left center; font-weight:bold; width:56%; }
.windowbox table.static_display td ul li { list-style-type:disc; margin: 0 0 4px 20px; }

/* tabs in windowbox */
.windowbox .head .m .tabs { margin: 4px 0 -4px -7px; }
.windowbox .head .m .tabs li a span.text { padding-top: 1px; }
/*********************************/	

.infomenu { width: 890px; margin: 0px auto; }


/*** PANEL ***********************/	
.panel { border: 1px solid #C0B1D0; margin: 10px 0; }
.panel h1 { color: #61377F; font: bold 11px Tahoma, Helvetica, sans-serif; 
	background: url(../img/bg-panel-header.gif) 0 0 repeat-x; padding: 4px 0 3px 6px;
	border-left: 1px solid #F1EEF4; border-right: 1px solid #F1EEF4; border-bottom: 1px solid #C0B1D0;
}
.panel h1 .EXTtooltip { float:right; }
.panel h1 .panel-icon { margin: -1px 6px 0 -2px; }

.panel .panel-content-frame { border-color: #F1EEF4; border-style: solid; border-width: 0 1px 1px 1px; padding: 5px; background: #EAE5EF; }
.panel .panel-content-frame .panel-content { display:inline-block; width:auto; }

.panel .panel-content-frame .panel-content .col3 { float:left; width: 280px; }
.ext-ie .panel .panel-content-frame .panel-content .horiz { width: 270px; }
.panel .panel-content-frame .panel-content .col3 .half { float:left; width: 140px; }

.panel-inactive,
.panel-inactive .x-panel-header-text .x-panel-header-subtitle,
.panel-inactive .x-panel-header-text { border-color: #999 !important; color: #999 !important; }

/*********************************/	

.ext-ie .panel .panel-content-frame .panel-content .pc-horiz {width: 246px;}
.panel .panel-content-frame .panel-content .pc-col3 {float: left; width: 246px; padding: 2px 2px 0 2px; }
.panel .panel-content-frame .panel-content .pc-col3-separator {float: left; width: 38px; padding: 12px 5px 0 0; text-align: center; font-weight: bold; color: #623683; }
.panel .panel-content-frame .panel-content .pc-grouped {float: left; height: 45px; background: #e3d9eb; border: 1px solid #C0B1D0; }

.panel .panel-content-frame .panel-content .pc-col3 .wwgrp .wwgrp {width: auto; float: left; clear: none;}
.panel .panel-content-frame .panel-content .pc-col3 .wwgrp .wwgrp .wwlbl {float: left;}
.panel .panel-content-frame .panel-content .pc-col3 .wwgrp .wwgrp .wwlbl label { padding:4px; display:block; }

.panel .panel-content-frame .panel-content .pc-col3 .wwgrp .wwgrp .wwctrl {width: 60px; }
.panel .panel-content-frame .panel-content .pc-col3 .wwgrp .wwgrp .wwctrl input {width: 40px; }

.pc-horiz .wwgrp { width: 100%; }
.pc-horiz .wwgrp .wwctrl { width: 245px; }
.pc-horiz .wwlbl { margin-bottom:2px; float:none; }
.pc-horiz .wwlbl label { width:auto; white-space:nowrap; padding:0; float:none !important; }
.pc-horiz .wwctrl input { width: 235px; }
.pc-horiz .wwctrl select { width: 243px; }
.pc-wwsbmt { float:right; clear:both; }
.pc-wwsbmt > div { float:left; }
.pc-wwsbmt input { float:left; margin: 3px 0 3px 20px; width:100px; font: normal 12px tahoma,arial,helvetica,sans-serif;}
* html .pc-wwsbmt { margin-left: 31px; }


.corporate-reg .wwgrp { width: 109%; }
.corporate-reg .wwgrp .wwctrl { width: 210px; }
.corporate-reg .wwlbl { margin-bottom:2px; float:none; }
.corporate-reg .wwlbl label { width:85px; white-space:nowrap; font-style: bold; padding-top:6.5px; margin-left:55px; float:left !important; }
.corporate-reg .wwctrl input { width: 235px; white-space:nowrap}
.corporate-reg .wwctrl select { width: 204px; }

.checkbox-list { width: 109%; font: 12px tahoma,arial,helvetica,sans-serif; float: left !important; padding-top: 0px; white-space: nowrap; color: #53306D; display:block; }
.checkbox-list .wwgrp { width: 13%; display:inline;}
.checkbox-list .wwgrp .wwctrl { width: 276px; margin-left:106px; margin-right: 4px; display:inline; float:none;}
.checkbox-list .wwlbl { margin-bottom:2px; float:right;}
.checkbox-list .wwlbl label { width:6px; white-space:nowrap; font-style: bold; margin-left:2px; float:left !important;  padding-top: 1px;}
.checkbox-list .wwctrl input { white-space:nowrap; width: auto; margin-left: 40px; border:none; outline:none; padding:0px 0px 0px 0px;}
.checkbox-list .corp-reg-label{ margin-left: 83px;};

#refbox #pc-refdata { padding: 0; margin: 0; font-size: 12px; font-family: tahoma, Arial, Helvetica, sans-serif; display:inline-block; }
#refbox #pc-refdata li { margin: 8px; float:left; }
#refbox #pc-refdata li span { float: left; line-height: 160%; }
#refbox #pc-refdata li strong { float: left; line-height: 160%; font-weight: bold; color: #623683; margin-left: 5px; }

#refbox #pc-refdata .wwgrp { float:left; clear:none; width: 50px; }
#refbox #pc-refdata .wwgrp .wwctrl { float:left; clear:none; }
#refbox #pc-refdata li input { float:left; color: #623683; width:38px; font-weight:bold; margin: 0; padding: 0 2px; margin: -1px 0; position: relative;}



/* "expand/collapse all" action link - update member screens */
.panel-expander { text-align: right; padding-right: 5px; }
.panel-expander a { text-align: right; font-weight: bold; color: #61377F; text-decoration: none; }
.panel-expander a .pei  { width: 15px; height: 15px; float: right; margin-left: 5px; background-image: url("../extjs/resources/images/default/panel/tool-sprites.gif"); background-repeat: no-repeat; }
.panel-expander .expand { display: inline-block; }
.panel-expander .collapse { display: none; }
.panel-expander-expanded .collapse { display: inline-block; }
.panel-expander-expanded .expand { display: none; }
.panel-expander .expand .pei { background-position: 0 -240px; }
.panel-expander .expand:hover .pei { background-position: -15px -240px; }
.panel-expander-expanded .collapse .pei { background-position: 0 -255px; }
.panel-expander-expanded .collapse:hover .pei { background-position: -15px -255px;}