/* Purpose:  these CSS definitions support Content Block #6240, also known as the 
   Online Service Center Main Menu.  Previous attempts at using Ektron to lay out the 
   page with tables proved unsatisfactory, so we use a more standardized HTML-CSS 
   infrastructure to achieve the precise design effects we want.  Tests show that
   Ektron does not corrupt the <div>-based version of the layouts when you insert directly
   into the HTML source.

   TIP:  Stage whatever text and graphics you want in a static .aspx or .htm code page, then debug
   the HTML and CSS using only that code page.  When you are satisfied with it, then carefully
   refresh the HTML in Ektron and re-publish along with a refreshed copy of this .css module.

   Revision History
   ----------------
   2014-Sep - Per SR #151848, expanded width of .dataValue class to undo word wrapping that occurs
   on multiple lines.  (EYang)
   2012-Nov - Added new styles .oscMainMenuGreetingLine1 and oscMainMenuGreetingLine2 
   in support of SR #127218.  (EYang)
   2012-Feb - New filename = OnlineServiceCenterMainMenu.css.  Old filename 
   OnlineServiceCenterT1.css implied it was "temporary."
   2011-Aug - Increases vertical spacing between menu items, possibly prevents
   misfiling CRM Internet Requests.  (EYang)
   2009-Dec - Holiday messaging added.  These definitions could be shared 
   with CrmRequestIntake.aspx.  (EYang)
   2009-Oct - Initial Release (EYang, NMehta)
   
*/

.oscMainMenuGreetingLine1 /* replacement for inline styling found in Content Block (EYang, Nov 2012) */
{
  text-align: center;
  font-weight: bold;
  font-size: 12pt;
}

.oscMainMenuGreetingLine2 /* replacement for inline styling found in Content Block (EYang, Nov 2012) */
{
  text-align: center;
  font-weight: normal;  
}

#OscMenuOuterContainer
{
  margin-top: 30px; /* extra clearance below <h1> requested by SSabatino, 10-30-09 */
  position: relative; /* sets anchor for positioning of child containers */
}

#OscMenuContainer1
{
  position: relative; /* LHS positioning, preserves document flow */
  left: 90px;
  top: 0px;
  width: 350px;
}

#OscMenuContainer2
{
  position: absolute; /* takes out of document flow for RHS positioning */
  left: 400px;
  top: 0px;
  width: 340px;
}

/* BEGIN - extends base definitions in SiteMasterLayout.css for CSS-style simulated tables */

.oscMenuContainer .dataTable .dataRow /* overrides base .dataRow definition in SiteMasterLayout.css */
{
  xxxpadding: 5px; /* in IE, padding = 5px creates good results */
  height: 90px; /* in Firefox, padding = 5px is not enough, but adding 
                   height = 90px gives enough clearance for images and text to display
                   properly in Content Block #6240; this value is increased from 70px 
                   to accommodate expansion to 3 links per header (EYang, Aug 2011) */
  padding-top: 0px; /* trying to fix vertical alignment between containers 1 and 2 */
  margin-top: 0px; /* trying to fix vertical alignment between containers 1 and 2 */
  margin-bottom: 40px; /* this value is increased from 30px to accommodate expansion 
                          to 3 links per header (EYang, Aug 2011) */
}

.oscMenuContainer .dataTable .dataRow .dataLabel /* overrides base .dataLabel definition in SiteMasterLayout.css */
{
  width: 55px; /* control width of data LABEL area for this specific table */
  padding-top: 0px; /* trying to fix vertical alignment between containers 1 and 2 */
  margin-top: 0px; /* trying to fix vertical alignment between containers 1 and 2 */
}

.oscMenuContainer .dataTable .dataRow .dataValue /* overrides base .dataValue definition in SiteMasterLayout.css */
{
  width: 250px; /* (was 190px through Sep 2014) control width of data VALUE area for this specific table, this value should be
                   at or near the widest control in the table */
  padding-left: 10px; /* because LABEL area right-justified, some additional spacing
                         to left of UI controls is necessary */
  padding-top: 0px; /* trying to fix vertical alignment between containers 1 and 2 */
  margin-top: 0px; /* trying to fix vertical alignment between containers 1 and 2 */
}
/* END - extends base definitions in SiteMasterLayout.css */

/* more specific definitions */
h2.oscMenuHeader
{
  margin-bottom: 0px;
  xxxpadding-bottom: 0px;
  padding-bottom: 6px; /* increased vertical spacing to discourage clicking on wrong item
                          and misfiling CRM Internet Requests (EYang, Aug 2011) */
  font-size: 1.2em;
}

/* NOTE - oscAnchor defintion was created all too quickly for <div> containers around <a> tags;
   better to use a more standardized <ul>/<li> type of structure */
.oscAnchor
{
  padding-top: 0px;
  margin-top: 0px;
  padding-bottom: 3px;
}

ul.oscMenuList
{
  /* list-style / margin / padding settings get rid of default bullet points */
  list-style: none;
  margin: 0px;
  padding: 0px;
}

ul.oscMenuList li
{
  padding-left: 0px; /* variations on indentation below header are possible */
  padding-bottom: 12px; /* increased vertical spacing to discourage clicking on wrong item
                           and misfiling CRM Internet Requests (EYang, Aug 2011) */
  font-size: 10pt;
  xxxbackground: transparent url(images/redarrow10x4.GIF) 1px 3px no-repeat;
}


/* nested ul-li-a requires that we separate out a:link, a:active, a:visited
   and a:hover to achieve desired styling AND make sure we don't interfere with
   other styles (EYang, Dec 2007) */
ul.oscMenuList li a:link
{
  text-decoration: none; 
  color: #000099; /* #000099 = navy */ 
  font-weight: normal;
}

ul.oscMenuList li a:visited 
{
  text-decoration: none; 
  color: #000099; /* #000099 = navy */ 
  font-weight: normal;
}

ul.oscMenuList li a:hover 
{
  text-decoration: underline; 
  color: #000099; /* #000099 = navy */ 
  font-weight: normal;
}

/* BEGIN - holiday messaging */

/* NOTE - attempts to name these styles '311HolidayMessage' failed, apparently the leading digit
   in the class name is not permitted - go figure */
.callCenterHolidayMessageOuterContainer
{
  display: block; /* 'block' means message is visible, 'none' means message is hidden */
  padding: 0px;
  background-color: #ffffff;
  border: solid 1px #000000;
  position: relative; /* sets anchor for child control positioning */
}

.callCenterHolidayMessageInnerContainer
{
  background-image: url('images/besGeneral/informationIcon35pct.jpg'); /* informationIcon35pct.JPG */
  background-position: top left;
  background-repeat: no-repeat;
  
  position: relative;
  left: 5px;
}  

.callCenterHolidayMessageInnerContainer h2
{
  position: relative; /* positioning selected to optimize header display relative to the background .gif */
  margin-top: 5px;
  top: 7px;
  left: 40px;
  padding-right: 50px; /* padding-right compensates for the relative-left positioning to prevent
                          text overflowing past right edge of outer container */
  font-size: 9pt;
}

.callCenterHolidayMessageInnerContainer p
{
  position: relative; /* positioning selected to optimize header display relative to the background .gif */
  left: 40px;
  padding-right: 50px; /* padding-right compensates for the relative-left positioning to prevent
                          text overflowing past right edge of outer container */
  font-size: 8pt;
}

/* END - holiday messaging */