/* Purpose:  These CSS definitions support Content Block #76992, 
   aka "Permit Service Center Self-Service Kiosk."  All styles contained on this page are 
   based on previous work done in support of the Online Service Center. 

   Background:  Previous attempts at using Ektron to lay out menu pages 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 .htm file, then debug
   the HTML and CSS using only this static file.  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
   ----------------
   2011-Dec - Copied Code from OnlineServiceCenterT1.css, renamed all variables by replacing "osc"
   with "psc".  Increased vertical spacing between menu items to accommodate 4 links per item (BLavin)   
*/
#PscMenuOuterContainer
{
  margin-top: 30px; /* extra clearance below <h1> requested by SSabatino, 10-30-09 */
  position: relative; /* sets anchor for positioning of child containers */
}

#PscMenuContainer1
{
  position: relative; /* LHS positioning, preserves document flow */
  left: 90px;
  top: 0px;
  width: 350px;
}

#PscMenuContainer2
{
  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 */

.pscMenuContainer .dataTable .dataRow /* overrides base .dataRow definition in SiteMasterLayout.css */
{
  xxxpadding: 5px; /* in IE, padding = 5px creates good results */
  height: 110px; /* 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) */
                /* increased height to 110px to accommodate expansion to 4 links in
                   Content Block 76992 (BLavin, Dec 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: 50px; /* this value is increased from 30px to accommodate expansion 
                          to 3 links per header (EYang, Aug 2011) */
                       /* this value is increased from 40px to accommodate expansion 
                          to 4 links per header (BLavin, Dec 2011) */
}

.pscMenuContainer .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 STYLE=margin-top:-55px;*/
}

.pscMenuContainer .dataTable .dataRow .dataValue /* overrides base .dataValue definition in SiteMasterLayout.css */
{
  width: 190px; /* 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.pscMenuHeader
{
  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 - pscAnchor defintion was created all too quickly for <div> containers around <a> tags;
   better to use a more standardized <ul>/<li> type of structure */
.pscAnchor
{
  padding-top: 0px;
  margin-top: 0px;
  padding-bottom: 3px;
}

ul.pscMenuList
{
  /* list-style / margin / padding settings get rid of default bullet points */
  list-style: none;
  margin: 0px;
  padding: 0px;
}

ul.pscMenuList 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.pscMenuList li a:link
{
  text-decoration: none; 
  color: #000099; /* #000099 = navy */ 
  font-weight: normal;
}

ul.pscMenuList li a:visited 
{
  text-decoration: none; 
  color: #000099; /* #000099 = navy */ 
  font-weight: normal;
}

ul.pscMenuList li a:hover 
{
  text-decoration: underline; 
  color: #000099; /* #000099 = navy */ 
  font-weight: normal;
}
