/* Container = the span around all of the content in the control panel pages*/
.container
 {
    padding: 10px;
    display:inline-block;
    width:99%;
    font-size: small;
    text-align:center;
 }
 #outline table,
#outline tbody
{
	margin:auto;
}
#outline
{
	margin:auto;	
}
 
 /* AddEditSection = the right hand side of the page on all Control Panel pages */
.addEditSection
{
    width: 45%;
    float:left;
    text-align:left;
    height: 300px;
    margin-left: 10px;
    font-size:small;
}

/* ListSection = the left hand side of the page on all Control Panel pages**/
.listSection
{
    float:left;
    width:50%;
    text-align:left;
    height: auto;
    font-size:x-small;
}

/**Make elements in addedit section fill the space **/
.addEditSection input,
.addEditSection textarea
{
    width: 95%;
}

/* We set all inputs in the addEditSection to be 95%, but need to override this for checkboxes**/
.addEditSection .checkBox
{
    width:auto;
}
 .checkBox label
 {
    width:auto;
 }
 .checkBox input
 {
    width: 17px;
 }

.addEditGrid
{
    width: 85%;
}

/** Command Section = the buttons at the bottom (Save /Cancel) **/
.commandSection
{
    float:left;
    height: 40px;
    margin-top: 10px;
    width:80%;
    padding-right: 20px;
    text-align:right;
    margin-right: 20px;
}

.commandSection input
{
    height:22px;
    float:left;
}

/** Make the width of the date text box match the calendar extender's width */
.addEditSection .dateTextBox
{
    width: 180px;
}

 .tinyImageButton,
 .tinyButtonTD input
 {
    height: 19px;
    width: auto !important;
    float:left;
 }
 
 /* This is for the popups such as on the IOA Events page*/
 .popupContainer
 {
    display:inline-block;
    width: 400px;
    height: 250px;
    padding: 15px;
    background-color:#CEE6FF;
    text-align:left;
 }
 
.smallGridSpan
{
    border: 3px solid #0076C0;
    height: 130px;
    display:inline-block;
    overflow-y:scroll;
    width: 200px;
    margin-right:3px;
    margin-top:3px;
    margin-bottom:3px;
}

 /* This is for the large popups such as Activities on the IOA Events page*/
 .largePopupContainer
 {
    float:left;
    position:absolute;
    top: 400px;
    left: 200px;
    width: 700px;
    height: 400px;
    padding: 15px;
    background-color:#CEE6FF;
 }

 .popupContainer textarea
 {
    width: 95%;
    height: 100px;
 }
 .popupContainer .longTextBox
 {
    width: 90% !important;
 }
 .invisible
 {
  display:none;  
 }
 .addButton
 {
     height: 22px;
     width: 37px !important;
     margin-bottom: -3px;
 }
 .Grid_Header
 {
    text-align:left;
    background-color:#0076C0;
    color:White !important;
 }
 Caption
 {
    font-weight: bold;
    padding-top:6px;
    padding-bottom:6px;
 }
/*  Copied from styles.css */
.Grid_Header a:link 
{
     color:White; 
     background-color:#0076C0; 
     text-decoration:underline; 
}
/*  Copied from styles.css */
.Grid_Header a:visited 
{ 
        color:White; 
        background-color:#0076C0; 
        text-decoration:underline;
}
/*  Copied from styles.css */
.Grid_Header a:hover,
.GridHeader a:active, 
.GridHeader a:focus 
{
    color:White; 
    background-color:#0076C0; 
    text-decoration:underline; 
}
/* The top-level heading of the grid, or the grid's "title" */
caption
{
    background-color: #B3CC95;
}
.Grid
{
    float:left;
}
/* This makes the Grid's div scroll when the grid contents are too wide,
    so that the grid doesn't take over the whole page */
.listSection div
{
    overflow-x:scroll;
}
.headingLabel
{
    font-size:1.20em;
    width: auto;
}
.smallText
{
    font-size:small;
}
 
.largePopupContainer .listSection
{
    width: auto;
    float:left;
}

.largePopupContainer .listSection .gridSpan
{
    height: 300px !important;
    width: 350px !important;
    float:left;
    overflow-y:scroll !important;
    border: 1px solid white;
}

.largePopupContainer .addEditSection
{
    width: 300px !important;
    margin-left: 15px;
    float:left;
}

.largePopupContainer .addEditSection input
{
    width: 95%;
}

 .largePopupContainer .addEditSection .checkBox input
 {
    width: 17px;
 }
 
 .largePopupContainer .addEditSection .checkBox label
{
    width:auto;
}

/* Event headings are supposed to be bold */
.EventGrid .EventHeading
{
    font-weight:bolder;
}

.EventGrid
{
    width: 100%;
    margin-bottom: 20px;
    text-align:left;
}

/* For putting two grids next to each other, as on IOA Events page*/
.sideBySide
{
    float:left;
    width: 250px;
}
/* For formatting multiple controls per line, as on registration page*/
.controlSpan
{
    text-align:left !important;
    width: 230px;
    float:left;
}
.control
{
    text-align:left !important;
    width: 100%;
    float:left;
}
.controlSpan input
{
    width: 95%;
}

.wideSpan
{
    text-align:left;
    float:left;
    width: 95%;
}

.wideSpan textarea
{
    width:100%
}
/* For small grids*/
.SmallAlternateRow,
.SmallRow
{
    font-size:smaller;
}
/* For small grids*/
.Grid .SmallAlternateRow
{
    background-color:#CED0D2;
}
.DetailsPanel
{
     border: 1px solid gray;
     margin: 10px;
     padding:10px;
     float:left;
     display:block;
     background-color: White;
}

.Grid_Alternate_Row
{
    background-color:#DDDDDD;
}
/* Used on pages to view registrations, Pac contributions, and dues */
.nameLabel
{
font-size: large;
font-weight:bold;
}

.infoLabel
{
 float:left;
 width:200px;
 margin-left: 15px;
}

/* used on MembersOnly/MemberDirectory page*/
.PaddedItem
{
    padding:10px;
    font-size:small;
}
.Button
{
    border: 1px solid black;
    padding: 3px 8px 4px 8px;
    text-decoration: none !important;
    color:White !important;
    background-image: url(images/navOn.gif);
    background-position: top left;
    background-repeat:repeat-x;
    bottom: 0px;
    position:relative;
    font-size: 10px;
    display:inline;
    margin:3px 3px 3px 0px;
    float:left;
}
.Button:hover
{
    background-image: url(images/navOver.gif);
    color:Black !important;
}
br
{
    display:block;
    height: 0px !important;
}
.MenuClass td
{
    padding-left: 0px;
}
.LoginButton 
{
    display:block;
}
.WelcomeLabel 
{
    float:left;
    margin-top: 10px;
    padding-bottom: 10px;
}
#ControlPanelMenu,
#MemberMenu 
{
	  z-index:100 !important;
	  float:left;
}

.ctl00_ControlPanelMenu_0 table tbody a,
#menusDiv table tbody a,
.ctl00_MemberMenu_0 table tbody a
{
    text-decoration: none !important;
    padding:3px;
    text-align:left;
    float:left;
}

.ctl00_ControlPanelMenu_0 tbody,
#menusDiv tbody,
.ctl00_ControlPanelMenu_0 table tbody,
.ctl00_MemberMenu_0 tbody,
.ctl00_MemberMenu_0 table tbody{
    background-color:#C1D9A2 !important;
    float:left;
      z-index:100 !important;
}

.ctl00_ControlPanelMenu_0,
.ctl00_MemberMenu_0
{
    padding-top: 10px;
    padding-bottom: 10px;
    background-color:#C1D9A2 !important;
    border: 1px solid #698C39;
    float:left;
}
div#MemberMenun0Items
{
	width:140px;
	z-index:100 !important;
}
div#ControlPanelMenun0Items 
{
	width:160px;
	z-index: 100 !important;
}
.specialBullets li 
{
    list-style-image: url(images/SwirlyBullet.gif);
    vertical-align:top; 
    padding-bottom:3px; 
    padding-left:10px;
}
.specialBulletsGreen li 
{
    list-style-image: url(images/SwirlyBulletGreen.gif);
    vertical-align:top; 
    padding-bottom:3px; 
    padding-left:10px;
}
.hidden
{
    display:none;
}