/*
* Global styles ****************************************************************
*/
body { background-color: #424242; color: #333333; font-family: Arial, sans-serif, serif; margin: 7px; margin-top: 10px; }
form { margin: 0px; }
table { font-size: 10pt; }
a,
a:active,
a:link,
a:visited { color: #E57100; text-decoration: none; }
a:hover { text-decoration: underline; }
a img { border-width: 0; }
thead a,
thead a:active,
thead a:link,
thead a:visited { color: #ffffff; }

img#captcha { border: 1px solid #aaaaaa; }

.exception { background-color: #e8e8e8; font-family: Courier; font-size: 10pt; padding: 6px; }


/*
* - rounded corners ------------------------------------------------------------
*/
.roundcont { width: 100%; }
.roundtop { background-position: top right; background-repeat: no-repeat; }
.roundbottom { background-position: top right; background-repeat: no-repeat; clear: left; }
img.corner { border: none; display: block !important; width: 19px; height: 19px; }

/* white rounded corners ---------------------------------------------------- */
div.white { background-color: #ffffff; }
div.white .roundtop { background-image: url('../../images/whiteNE.gif'); }
div.white .roundbottom { background-image: url('../../images/whiteSE.gif'); }


/*
* - advertisement banners ------------------------------------------------------
*/
/* adverts that sit outside the main content area - inherits elements from
   rounded corners
*/
div.advertisers-outside { background-color: #515151; margin-bottom: 6px; }
div.advertisers-outside .roundtop { background-image: url('../../images/advertisers.outside.ne.gif'); }
div.advertisers-outside .roundbottom { background-image: url('../../images/advertisers.outside.se.gif'); }
div.advertisers-outside img.corner { width: 10px; height: 10px; }
div.advertisers-outside div.content { text-align: center; }
div.advertisers-outside-bottom { margin-top: 9px; }

div.advertisers-inside h1 { color: #a0a0a0; margin: 0; text-align: center; padding: 4px; font-size: 8pt; font-weight: bold; }
div.advertisers-inside div.content { margin: 0; padding: 6px 0px 6px 0px; text-align: center; }


/*
* drop down menus --------------------------------------------------------------
*/
#dropmenudiv { position: absolute; border: 1px solid #E57100; font: 8pt Arial; z-index: 100; }
#dropmenudiv a,
#dropmenudiv a:active,
#dropmenudiv a:link,
#dropmenudiv a:visited { width: 100%; display: block; padding: 2px; text-decoration: none; }
#dropmenudiv a:hover { text-decoration: underline; }


/*
* Page blocks ------------------------------------------------------------------
*/
/* header ------------------------------------------------------------------- */
div#header { margin: 0 0 6px 0; }
div#header table { font-size: 10pt; }
div#header table td { color: #ffffff; }
div#header table td a { color: #66ccff; }
div#header table td.logo { padding-bottom: 16px; }
div#header div#account-menu { text-align: right; margin-right: 10px; }

/* footer ------------------------------------------------------------------- */
div#footer { color: #ffffff; font-size: 7pt; padding: 0px 10px 0px 10px; }
div#footer img { float: left; margin-right: 10px; }
div#footer .content { line-height: 12pt; }
div#footer a,
div#footer a:active,
div#footer a:link,
div#footer a:visited { color: #66ccff; }

/* main menu ---------------------------------------------------------------- */
div#mainmenu { background-color: #FF7E00; background-image: url('../../images/menu/bg.gif'); height: 46px; }
div#mainmenu img { float: left; display: block; }
div#mainmenu .ciab { background-color: #8598f4; background-image: url('../../images/menu/blue.bg.gif'); float: left; height: 46px; width: 122px; }
div#mainmenu a,
div#mainmenu a:active,
div#mainmenu a:link,
div#mainmenu a:visited { display: block; float: left; }

/* path (breadcrumb links) -------------------------------------------------- */
div#path
{
	border-bottom: 1px solid #DDDDDD; font-size: 8pt;
	margin-left: 9px; margin-right: 9px;
	padding-bottom: 6px; padding-left: 10px; padding-right: 10px; padding-top: 0px;
}

/* title -------------------------------------------------------------------- */
div#title
{
        margin-left: 12px; margin-right: 12px; margin-bottom: 12px;
	padding-top: 3px; padding-left: 3px; padding-right: 3px; padding-bottom: 5px;
}
div#title table h1 { margin: 0; }
div#title h1,
div#title table h1 { font-size: 20pt; margin: 4px; margin-left: 4px; margin-right: 4px; }
div#title .disabled,
div#title a,
div#title a:active,
div#title a:link,
div#title a:visited { font-size: 10pt; margin-left: 4px; margin-right: 4px; }
div#title a:hover { text-decoration: underline; }

/* page menu ---------------------------------------------------------------- */
div#left { float: left; font-size: 10pt; width: 148px; padding-left: 12px; }
/* div#left h1 { background-color: #e3e3e3; font-size: 10pt; margin: 0; padding: 3px; } */
ul#page-menu { background-color: #efefef; margin: 0; margin-bottom: 9px; padding: 0; }
ul#page-menu li { background-color: #e9e9e9; display: block; list-style-position: outside; list-style-type: none; margin: 1px; padding: 3px; }

/* content ------------------------------------------------------------------ */
div#content { margin-bottom: 7px; }
div#content div#center h1 { font-size: 20pt; }
div#content div#center h2 { font-size: 16pt; }
div#content div#center h3 { font-size: 10pt; }
div#content div#center h4 { font-size: 12pt; }
div#content div#center { font-size: 10pt; margin: 19px; margin-left: 172px; margin-top: 0; margin-bottom: 0; }
div#content div#center form { font-size: inherit; margin: 0px; padding: 0px; }
div#content div#center table.content { background-color: #ffffff; }
div#content .disabled { color: #c0c0c0; }

div.prevnext { background: #7c90eb url(../../images/global/bg.prevnext.gif) repeat-x; }
div.prevnext div.top { margin: 0 0 12px 0; }
div.prevnext div.bottom { margin: 12px 0 0 0; }
div.prevnext div.prev { float: left; display: inline; }
div.prevnext div.progress { color: #ffffff; height: 23px; line-height: 22px; margin: 0 26px 0 26px; text-align: center; }
div.prevnext div.next { float: right; display: inline; }


/*
* Data *************************************************************************
*
* Use for selected table listings, such as the main view in my messages or our
* stuff.
*/
div.datapanel table.datatable { border: 1px solid #5366c1; float: right; }
div.datapanel table thead td,
div.datapanel table thead th
{
  background-image: url('../../images/viewblock/menu.bg.gif');
  background-repeat: repeat-x;
  line-height: 23px;
}
div.datapanel table thead td,
div.datapanel table thead th,
div.datapanel table tfoot th { background-color: #7283d5; color: #FFFFFF; font-size: 8pt; font-weight: bold; }
div.datapanel table tbody td { border-bottom: 1px solid #ACACEA; }

.downtableitem { background-color: #e9e9ff; cursor: pointer; }
.overtableitem { background-color: #FFFFDD; cursor: pointer; }
.outtableitem { background: none; }
.disabledtableitem { background-color: #fcfcfc; color: #a0a0a0; }
tr.downtableitem th,
tr.downtableitem td,
tr.overtableitem th,
tr.overtableitem td,
tr.outtableitem th,
tr.outtableitem td,
tr.disabledtableitem th,
tr.disabledtableitem td,
tr.divide td,
td.divide { border-bottom: 1px solid #ACACEA; }

/*
* Generic view block ***********************************************************
*
* Used to generate different views of the same data, e.g. summary, day, month,
* etc. views in our calendar, or thumbnail and slideshow views in our photos.
*/
.viewblock
{
  border: 1px solid #5366c1;
}
.viewblock .menu
{
  background: url('../../images/viewblock/menu.bg.gif') repeat-x;
  padding: 2px 2px 2px 1px;
}
#content #center .viewblock .menu h2
{
  color: #FFFFFF;
  font-size: 10pt;
  line-height: 25px;
  padding: 0 4px 0 4px;
  margin: 0;
  text-align: right;
}
.viewblock .menu ul
{
  list-style-type: none;
  margin: 0 0 0 2px;
  padding: 0;
}
.viewblock .menu ul li
{
  display: block;
  float: left;
  line-height: 21px;
  margin: 0 3px 0 0;
  padding: 0 6px 0 6px;
}
.viewblock .menu ul li a
{
  color: #ffffff;
  font-weight: bold;
}
.viewblock .menu ul li.menuitemup,
.viewblock .menu ul li.menuitemover,
.viewblock .menu ul li.menuitemdown
{
  color: #ffffff;
  cursor: pointer;
  display: inline;
  float: left;
  font-size: 8pt;
  text-align: center;
}
.viewblock .menu ul li.menuitemup
{
  background: #8999e5;
  border: 1px solid #5366c1;
}
.viewblock .menu ul li.menuitemover,
.viewblock .menu ul li.menuitemdown
{
  background: #5367c7;
  border: 1px solid #21348d;
}
.viewblock .content,
.viewblock .content-right
{
  margin: 19px;
}
.viewblock .content-right
{
  margin-right: 228px;
}
.viewblock .right
{
  display: inline;
  float: right; 
  margin: 19px 19px 0 0;
  width: 190px;
}


/*
* Generic panel ****************************************************************
*/
div#content div#center div.panel { border: 1px solid #5366c1; }
div#content div#center div.panel h1
{
  background-image: url('../../images/viewblock/menu.bg.gif');
  color: #ffffff;
  font-size: 10pt;
  margin: 0px;
  padding: 4px;
  padding-top: 6px;
  padding-bottom: 7px;
}
div.panel div.content { padding: 3px; }
div.panel ul { margin-left: 1.5em; }
div.panel div.menu { border-top: 1px solid #5366c1; padding: 3px; }


/*
* Contacts Panel ***************************************************************
*/
#contactspanel
{
  font-size: 8pt;
}
#contactspanel #contactslist
{
  overflow-y: scroll;
}
#contactspanel #contactslist .contactout,
#contactspanel #contactslist .contactover,
#contactspanel #contactslist .contactdown
{
  border-bottom: 1px solid #ACACEA;
  padding: 4px;
}
#contactspanel #contactslist .contactover
{
  background-color: #FFFFDD;
  cursor: pointer;
}
#contactspanel #contactslist .contactdown
{
  background-color: #e9e9ff;
  cursor: pointer;
}
#contactspanel #contactslist .contact img
{
  margin-right: 2px;
}


/*
* Simple form ******************************************************************
*
* Standard formatting for a form with a two column table
*/
form table.simpleform th
{
  text-align: left;
}
span.required
{
  background-image: url('../../images/global/icons/required.gif');
  background-position: right top;
  background-repeat: no-repeat;
  padding-right: 20px;
}



/*
* Global formatting/padding ****************************************************
*
* Many of the styles below and probably deprecated now, but they remain here
* whilst people update their respective sections
*/
.thDivide
{
	background-color: #ACACEA;
        padding: 0px;
}
.trDivide
{
	background-color: #EAEEFF;
        padding: 0px;
}


/*
* Formatting to reinforce open/closed status of items **************************************
* These styles are primarily used in the invitations control panel,
* /MyCommunity/ManageInvitations.jsp
*/
.complete
{
  background-color: #ccff99;
  border-top: 1px solid #5366c1;
  color: #006600;
  font-size: 10pt;
  margin-bottom: 9px;
  padding: 5px;
}
.completefunctions
{
  border-top: 1px solid #5366c1;
  font-size: 10pt;
  margin-bottom: 9px;
  padding: 5px;
}
.pending
{
  background-color: #ffe6e6;
  border-bottom: 1px solid #5366c1;
  color: #FF0000;
  font-size: 10pt;
  margin-bottom: 9px;
  padding: 5px;
}
.pendingfunctions
{
  border-bottom: 1px solid #5366c1;
  font-size: 10pt;
  margin-bottom: 9px;
  padding: 5px;
}

/*
* Reporting (errors and status messages) ***************************************
*
* These styles are primarily used in the reporting includes,
* /includes/reporting/*.jsp
*/
.globalerror
{
  background-color: #ffe6e6;
  border: 1px solid #990000;
  color: #FF0000;
  font-size: 10pt;
  font-weight: bold;
  margin-bottom: 9px;
  padding: 5px;
}
.warning,
.message
{
  background-color: #e9e9ff;
  border: 1px solid #0090ff;
  color: #0066cc;
  font-size: 10pt;
  margin: 0;
  margin-bottom: 9px;
  padding: 5px;
}
.success
{
  background-color: #ccff99;
  border: 1px solid #01b701;
  color: #006600;
  font-size: 10pt;
  margin: 0;
  margin-bottom: 9px;
  padding: 5px;
}

.error
{
  color: #FF0000;
  font-size: 10pt;
}