/* --------------------------------------------------------------------------------------------
ALTER

DESCRIPTION:
Jobs to complete outside of, as well as throughout the entirety of, this document.
   * DEF: 'asset' = An asset can best be described as any item used in the creation of the site other than
   the HTML.  For example: images, flash, css files, etc.)

** NOTE: The current path for all assets associated with this site is: http://n1assets1.styles1.jamspiritsites.com/302/2133328308

INSTRUCTIONS:
Make changes to the following:
1. all asset URL paths in the following external documents should be changed to the appropriate client URL:
   * style_302.tpl, home.tpl, non-ie.css, ie.css
   ** NOTE: if no URL path exists in one of the aforementioned external documents, obviously
      no change is necessary
2. all asset URL paths in this document should be changed to the appropriate client URL
3. all color values in non-ie.css & ie.css as well as throughout this document should be altered
   ** NOTE: follow PSD instructions on what color each element will be
-------------------------------------------------------------------------------------------- */

/* -------------------------------------------------
content styling / GLOBAL
-- NOTE: pre-vA
------------------------------------------------- */

body
{
color: #808080;
font-family:  Comic Sans MS, Verdana, Arial, Tahoma;
}

a:active,
a:link,
.title_9,
.title_9Bold,
.title_10,
.title_10Bold,
.title_12,
.title_12Bold,
.title_14,
.title_14Bold,
.title_16,
.title_16Bold
{
color: #E50000;
}

/* Fix for calendar days of the week color. */
.white_9Bold
{
color: #FFF;
}

a:visited
{
color: #B30000;
}

a:focus,
a:hover
{
color: #EEF000;
}

.contentEdit h1
{
padding: 0.3em 0.5em 0.3em 1.5em;
margin: 0.2em 0;
font-size: 227%;
color: #FFE000;
background-color: #620017;
}

.contentEdit h2
{
padding: 0.3em 1.5em 0.3em 0.5em;
margin: 0.2em 0;
font-size: 227%;
color: #000;
background-color: #D0AF00;
}

.contentEdit h3
{
padding: 0.5em;
border: 1px solid #4D4D4D;
margin: 0.2em 0;
font-size: 182%;
color: #FFE000;
background: #0F0F0F;
}

.contentEdit h4
{
padding: 0.5em;
border: 1px solid #C00000;
margin: 0.2em 0;
font-size: 182%;
color: #FFE000;
background: #620000;
}

.contentEdit h5
{
padding: 0.25em 0.5em 0.25em 2em;
margin: 0.2em 0;
font-size: 138.5%;
color: #FFF;
}

.contentEdit h6
{
padding: 0.25em 0.5em 0.25em 2em;
margin: 0.2em 0;
font-size: 138.5%;
color: #FFE000;
}

.contentEdit h1,
.contentEdit h2,
.contentEdit h3,
.contentEdit h4,
.contentEdit h5,
.contentEdit h6
{
font-weight: normal;
font-family:  Comic Sans MS, Verdana, Arial, Tahoma;
}

.contentEdit img
{
border-color: #A78557;
}

/* To style images in content. */
.contentEdit img.imageStyle
{
border: none;
padding: 10px 10px 19px 10px;
background-color: #A78557;
}

a[href^="http:"]:active,
a[href^="http:"]:link,
a[href^="http:"]:visited
{
padding: 0 15px 0 0;
text-decoration: underline;
}

/* Fix for external link image on linked images in content. */
a[href^="http:"]:active.noIcon,
a[href^="http:"]:link.noIcon,
a[href^="http:"]:visited.noIcon,
a[href^="http:"]:focus.noIcon,
a[href^="http:"]:hover.noIcon
{
padding: 0;
background: none;
}

/* Fix for external link image on company box. */
div#companyBox a[href^="http:"]:active,
div#companyBox a[href^="http:"]:link,
div#companyBox a[href^="http:"]:visited
{
background: none;
padding: 0;
}

/* Fix for external link image on company logo. */
div#companyLogo a:active,
div#companyLogo a:link,
div#companyLogo a:visited,
div#companyLogo a:focus,
div#companyLogo a:hover
{
padding: 0;
}

a[href^="mailto:"]:active,
a[href^="mailto:"]:link,
a[href^="mailto:"]:visited,
a[href^="javascript:location.href='mailto:'"]:active,
a[href^="javascript:location.href='mailto:'"]:link,
a[href^="javascript:location.href='mailto:'"]:visited
{
padding: 0 16px 0 0;
}

a[href$=".pdf"]:active,
a[href$=".pdf"]:link,
a[href$=".pdf"]:visited
{
padding: 2px 18px 2px 0;
}

a[href$=".doc"]:active,
a[href$=".doc"]:link,
a[href$=".doc"]:visited
{
padding: 2px 24px 2px 0;
}

/* -------------------------------------------------
main structure
------------------------------------------------- */

body
{
background: #000;
padding: 0 0 40px 0;
}


div#wrapperOne
{
text-align: center;
}

div#container
{
width: 960px;
padding: 0 19px;
margin: 0 auto;
text-align: left;
background-position: -212px 0;
}

/* -------------------------------------------------
div#header
------------------------------------------------- */

/* -------------------------
div#headerInfo
------------------------- */

div#headerInfo
{
height: 30px;
}

div.headerIcon
{
float: left;
display: inline;
width: 80px;
height: 30px;
}

div.headerIcon a
{
display: block;
width: 80px;
height: 30px;
text-decoration: none;
text-indent: -9999px;
overflow: hidden;
}

/* --------- div#homeIcon --------- */

div#homeIcon a:focus,
div#homeIcon a:hover
{
background-position: 0 -30px;
}

/* --------- div#emailIcon --------- */


div#emailIcon a
{
background-position: -80px 0;
}

div#emailIcon a:focus,
div#emailIcon a:hover
{
background-position: -80px -30px;
}

/* --------------------------------------------------------------------------------------------
ALTER

DESCRIPTION:
Marquee

INSTRUCTIONS:
Make changes to the following:
1. if client does not have component activated, change visible to hidden, & vice versa
2. color value
3. PSD changes - if, by deactivating the marquee, image changes result, 
rename the wrapper bkgd above.
-------------------------------------------------------------------------------------------- */

#MarqueeWrapper 
{
float: left;
display: inline;
width: 635px;
height: 30px;
padding: 0 2px 0 3px;
}

#Marquee 
{
top: 0;
left: 0;
width: 635px;
height: 30px;
visibility: visible;
overflow: hidden;
}

#Marquee span 
{
width: 635px;
height: 30px;
line-height: 30px;
color: #B7B7B7;
}
/* END ALTER - Marquee */

/* --------- div#memberLogin --------- */

div#memberLogin
{
float: left;
display: inline;
width: 160px;
height: 30px;
text-align: center;
}

div#memberLogin a
{
display: block;
width: 160px;
height: 30px;
line-height: 30px;
text-decoration: none;
text-align: center;
color: #A80021;
overflow: hidden;
}

div#memberLogin a:focus,
div#memberLogin a:hover
{
color: #F6CB01;
background-position: 0 -30px;
}

/* -------------------------
div#horizontalNav
------------------------- */

div#horizontalNav
{
width: 960px;
height: 44px;
}

ul#Primary li
{
/* first level list items are always visible */
float: left;
display: inline;
position: relative;
width: 160px;
z-index: 1500;
}

ul#Primary li a:active,
ul#Primary li a:link,
ul#Primary li a:visited,
ul#Primary li a:focus,
ul#Primary li a:hover
{
display: block;
width: 150px;
height: 34px;
line-height: 34px;
padding: 5px;
text-decoration: none;
text-align: center;
text-transform: uppercase;
color: #FFD600;
overflow: hidden;
}

ul#Primary li a.doubleLine:active,
ul#Primary li a.doubleLine:link,
ul#Primary li a.doubleLine:visited,
ul#Primary li a.doubleLine:focus,
ul#Primary li a.doubleLine:hover
{
line-height: 17px;
}


ul#Primary li#navOne a:focus,
ul#Primary li#navOne a:hover
{
background-position: 0 -44px;
}

ul#Primary li#navTwo a:focus,
ul#Primary li#navTwo a:hover
{
background-position: -160px -44px;
}

ul#Primary li#navThree a:focus,
ul#Primary li#navThree a:hover
{
background-position: -320px -44px;
}

ul#Primary li#navFour a:focus,
ul#Primary li#navFour a:hover
{
background-position: -480px -44px;
}

ul#Primary li#navFive a:focus,
ul#Primary li#navFive a:hover
{
background-position: -640px -44px;
}

ul#Primary li#navSix a:focus,
ul#Primary li#navSix a:hover
{
background-position: -800px -44px;
}

/* --------- ul#Primary li ul --------- */

ul#Primary li ul 
{
/* second level unordered lists appear off-page until mouseover */
position: absolute;
width: 158px;
height: auto;
top: auto;
left: -9999px;
padding: 0;
border: 1px solid #000;
margin: 0;
list-style: none;
overflow: hidden;
z-index: 2000;
}

ul#Primary li ul li
{
width: 158px;
height: auto;
}

ul#Primary li#navOne ul li a:active,
ul#Primary li#navOne ul li a:link,
ul#Primary li#navOne ul li a:visited,
ul#Primary li#navOne ul li a:focus,
ul#Primary li#navOne ul li a:hover,
ul#Primary li#navTwo ul li a:active,
ul#Primary li#navTwo ul li a:link,
ul#Primary li#navTwo ul li a:visited,
ul#Primary li#navTwo ul li a:focus,
ul#Primary li#navTwo ul li a:hover,
ul#Primary li#navThree ul li a:active,
ul#Primary li#navThree ul li a:link,
ul#Primary li#navThree ul li a:visited,
ul#Primary li#navThree ul li a:focus,
ul#Primary li#navThree ul li a:hover,
ul#Primary li#navFour ul li a:active,
ul#Primary li#navFour ul li a:link,
ul#Primary li#navFour ul li a:visited,
ul#Primary li#navFour ul li a:focus,
ul#Primary li#navFour ul li a:hover,
ul#Primary li#navFive ul li a:active,
ul#Primary li#navFive ul li a:link,
ul#Primary li#navFive ul li a:visited,
ul#Primary li#navFive ul li a:focus,
ul#Primary li#navFive ul li a:hover,
ul#Primary li#navSix ul li a:active,
ul#Primary li#navSix ul li a:link,
ul#Primary li#navSix ul li a:visited,
ul#Primary li#navSix ul li a:focus,
ul#Primary li#navSix ul li a:hover
{
display: block;
width: 148px;
height: auto;
line-height: 18px;
padding: 13px 5px;
text-decoration: none;
text-align: center;
color: #FFD600;
background-color: #000;
overflow: hidden;
}

ul#Primary li#navOne ul li a:focus,
ul#Primary li#navOne ul li a:hover,
ul#Primary li#navTwo ul li a:focus,
ul#Primary li#navTwo ul li a:hover,
ul#Primary li#navThree ul li a:focus,
ul#Primary li#navThree ul li a:hover,
ul#Primary li#navFour ul li a:focus,
ul#Primary li#navFour ul li a:hover,
ul#Primary li#navFive ul li a:focus,
ul#Primary li#navFive ul li a:hover,
ul#Primary li#navSix ul li a:focus,
ul#Primary li#navSix ul li a:hover
{
background-color: #5F0018;
}

ul#Primary li.hover ul 
{ 
/* on mouseover, move the list to it's normal position */
top: 44px;
left: 0;
}

/* -------------------------
div#Banner
------------------------- */

div#Banner
{
width: 960px;
height: 261px;
}

div#Banner img,
div#Banner object
{
display: block;
}

/* -------------------------
div#locationNav
------------------------- */

div#locationNav
{
width: 960px;
height: 50px;
}

ul#Secondary li
{
float: left;
display: inline;
position: relative;
width: 160px;
}

ul#Secondary li a:active,
ul#Secondary li a:link,
ul#Secondary li a:visited,
ul#Secondary li a:focus,
ul#Secondary li a:hover
{
display: block;
width: 140px;
height: 34px;
line-height: 34px;
padding: 8px 10px 8px 10px;
text-decoration: none;
text-align: center;
text-transform: uppercase;
color: #FFD600;
overflow: hidden;
}

ul#Secondary li a.doubleLine:active,
ul#Secondary li a.doubleLine:link,
ul#Secondary li a.doubleLine:visited,
ul#Secondary li a.doubleLine:focus,
ul#Secondary li a.doubleLine:hover
{
line-height: 17px;
}

ul#Secondary li#locOne a:focus,
ul#Secondary li#locOne a:hover
{
background-position: 0 -50px;
}

ul#Secondary li#locTwo a:focus,
ul#Secondary li#locTwo a:hover
{
background-position: -160px -50px;
}

ul#Secondary li#locThree a:focus,
ul#Secondary li#locThree a:hover
{
background-position: -320px -50px;
}

ul#Secondary li#locFour a:focus,
ul#Secondary li#locFour a:hover
{
background-position: -480px -50px;
}

ul#Secondary li#locFive a:focus,
ul#Secondary li#locFive a:hover
{
background-position: -640px -50px;
}

ul#Secondary li#locSix a:focus,
ul#Secondary li#locSix a:hover
{
background-position: -800px -50px;
}

/* -------------------------------------------------
div#middle
------------------------------------------------- */

/* -------------------------------------------------
div#internal
------------------------------------------------- */

h2#pageTitle
{
width: 900px;
padding: 22px 30px 17px 30px;
line-height: 34px;
font-size: 227%;
color: #D8D8D8;
background-color: #000;
}

div#pageContent
{
width: 900px;
min-height: 409px;
padding: 20px 30px 30px 30px;
font-family:  Verdana, Arial, Tahoma;
}

* html div#pageContent
{
height: 409px;
}

/* -------------------------------------------------
div#home
------------------------------------------------- */

/* -------------------------
div#homeTop
------------------------- */

/* ------- div#toolBoxOne --------- */

div#toolBoxOne
{
float: left;
display: inline;
width: 640px;
}

* html div#toolBoxOne
{
overflow: hidden;
}

h2#toolBoxOne-title
{
width: 580px;
padding: 22px 30px 17px 30px;
line-height: 34px;
font-size: 227%;
color: #D8D8D8;
background-color: #000;
}

div#toolBoxOne-content
{
width: 580px;
min-height: 409px;
padding: 20px 30px 0 30px;
font-family:  Verdana, Arial, Tahoma;
}

* html div#toolBoxOne-content
{
height: 409px;
}

/* ------- div#homeComponentBox --------- */

div#homeComponentBox
{
float: left;
display: inline;
width: 320px;
}

* html div#homeComponentBox
{
overflow: hidden;
}

div.toolBox
{
width: 262px;
padding: 43px 29px 0 29px;
}

h3.toolBox-title
{
width: 220px;
height: 28px;
padding: 0 21px 24px 21px;
}

h3.toolBox-title a:active,
h3.toolBox-title a:link,
h3.toolBox-title a:visited,
h3.toolBox-title a:focus,
h3.toolBox-title a:hover
{
display: block;
width: 220px;
height: 32px;
text-decoration: none;
text-align: center;
font-size: 182%;
color: #D9BA18;
overflow: hidden;
}

div.toolBox-content
{
width: 222px;
min-height: 240px;
padding: 0 20px;
}

* html div.toolBox-content
{
height: 240px;
}

/* If the home components are LINKS make sure the last class for the toolBox-content is toolBox-link */
div.toolBox-links td.vB-icontd
{
display: none;
}

div.toolBox-links td.vB-itemtd
{
padding: 0;
}

div.toolBox-links a:active,
div.toolBox-links a:link,
div.toolBox-links a:visited,
div.toolBox-links a:focus,
div.toolBox-links a:hover
{
display: block;
width: 218px;
line-height: 20px;
padding: 10px 2px;
margin: 0 0 10px 0;
text-decoration: none;
font-size: 13px;
color: #EBD356;
filter:alpha(opacity=75);
opacity: 0.75;
-moz-opacity:0.75;
background: #410000;
overflow: hidden;
}

div.toolBox-links a:focus,
div.toolBox-links a:hover
{
color: #FFF;
}
/* end home component links */

/* If the home components is RSS make sure the second class for the toolBox-content is toolBox-rss */
div.toolBox-rss td.vB-icontd
{
display: none;
}

div.toolBox-rss
{
color: #FF0000;
}

div.toolBox-rss a[href^="http:"]:active,
div.toolBox-rss a[href^="http:"]:link,
div.toolBox-rss a[href^="http:"]:visited,
div.toolBox-rss a[href^="http:"]:focus,
div.toolBox-rss a[href^="http:"]:hover
{
padding: 0;
color: #EDC702;
background: none;
}

div.toolBox-rss a[href^="http:"]:focus,
div.toolBox-rss a[href^="http:"]:hover
{
color: #FFF;
}
/* end home component rss */

/* If the home components is VIDEO make sure the second class for the toolBox-content is toolBox-video */
div.toolBox-video
{
color: #FF0000;
}

div.toolBox-video a:active,
div.toolBox-video a:link,
div.toolBox-video a:visited,
div.toolBox-video a:focus,
div.toolBox-video a:hover
{
color: #EDC702;
}

div.toolBox-video a:focus,
div.toolBox-video a:hover
{
color: #FFF;
}

div.toolBox-video a[href^="http:"]:active,
div.toolBox-video a[href^="http:"]:link,
div.toolBox-video a[href^="http:"]:visited,
div.toolBox-video a[href^="http:"]:focus,
div.toolBox-video a[href^="http:"]:hover
{
padding: 0;
background: none;
}

div.toolBox-video img.hmCmp-vidImg
{
border-color: #000;
background-color: #A07F52;
}

div.toolBox-video ul#hmCmp-video li:first-child img.hmCmp-vidImg
{
border-width: 1px;
border-color: #000;
background-color: #A07F52;
}

div.toolBox-video ul#hmCmp-video li:first-child img.hmCmp-vidImg
{
width: 218px; /* orig 272 */
height: 150px; /* orig 204 */
}
/* end home component video */

h4.toolBox-subTitle
{
width: 262px;
height: 51px;
}

h4.toolBox-subTitle a:active,
h4.toolBox-subTitle a:link,
h4.toolBox-subTitle a:visited,
h4.toolBox-subTitle a:focus,
h4.toolBox-subTitle a:hover
{
display: block;
width: 262px;
height: 51px;
text-decoration: none;
text-indent: -9999px;
overflow: hidden;
}

/* ------- div#toolBoxTwo-wrapper --------- */

div#toolBoxTwo-wrapper
{
padding: 0 0 30px 0;
background: #AA0000;
}

h4#toolBoxTwo-subTitle a:focus,
h4#toolBoxTwo-subTitle a:hover
{
background-position: 0 -51px;
}

/* ------- div#toolBoxThree-wrapper --------- */

h4#toolBoxThree-subTitle a:focus,
h4#toolBoxThree-subTitle a:hover
{
background-position: 0 -51px;
}

/* -------------------------
div#homeBottom
------------------------- */

div#homeBottom
{
width: 960px;
height: 197px;
padding: 61px 0 0 0;
}

/* ------- div#toolBoxFour --------- */

div#toolBoxFour
{
float: left;
display: inline;
width: 212px;
padding: 9px 0 0 54px;
}

h3#toolBoxFour-title a:active,
h3#toolBoxFour-title a:link,
h3#toolBoxFour-title a:visited,
h3#toolBoxFour-title a:focus,
h3#toolBoxFour-title a:hover
{
display: block;
width: 212px;
height: 28px;
line-height: 28px;
text-decoration: none;
text-align: center;
font-size: 182%;
color: #D9BA18;
overflow: hidden;
}

div.homeComponentBox-image
{
width: 144px;
height: 96px;
padding: 4px 0 0 34px;
}

/* ------- div#memberBox --------- */

/* --------------------------------------------------------------------------------------------
ALTER

DESCRIPTION:
Members box ALTER

INSTRUCTIONS:
Make changes to the following:
1. if site has member area, default visibility to visible - othewise, change visible to hidden
-------------------------------------------------------------------------------------------- */
div#memberBox
{
float: left;
display: inline;
visibility: visible;
width: 262px;
padding: 0 109px 0 83px;
}
/* END ALTER - Member Box */

h3#memberBox-title
{
padding: 0 0 8px 0;
line-height: 28px;
text-align: center;
font-size: 182%;
color: #D9BA18;
}

div.memberBox-login-info
{
width: 262px;
height: 30px;
padding: 3px 0 17px 0;
}

p.memberBox-label
{
float: left;
display: inline;
width: 80px;
padding: 0 1px 0 0;
line-height: 30px;
text-align: center;
text-transform: lowercase;
font-size: 108%;
color: #D9BA18;
}

input.memberBox-textBox
{
float: left;
display: inline;
width: 142px;
height: 18px;
line-height: 18px;
padding: 6px;
border: none;
margin: 0 1px 0 0;
color: #D9BA18;
}

input.memberBox-textBox:focus
{
color: #FF0000;
background-position: 0 -30px;
}

a.forgot
{
float: left;
display: inline;
width: 26px;
height: 30px;
text-decoration: none;
text-indent: -9999px;
overflow: hidden;
}

a.forgot:focus,
a.forgot:hover
{
background-position: 0 -30px;
}

div#memberBox-register
{
float: left;
display: inline;
width: 163px;
line-height: 30px;
}

div#memberBox-register a
{
display: block;
width: 163px;
line-height: 30px;
text-decoration: none;
text-indent: -9999px;
overflow: hidden;
}

div#memberBox-register a:focus,
div#memberBox-register a:hover
{
background-position: 0 -30px;
}

button#memberBox-buttons-enter
{
float: left;
display: inline;
width: 99px;
height: 30px;
}

button#memberBox-buttons-enter
{
display: block;
width: 99px;
height: 30px;
padding: 0;
border: 0;
margin: 0;
text-decoration: none;
text-indent: -9999px;
overflow: hidden;
cursor: pointer;
}

button#memberBox-buttons-enter:focus,
button#memberBox-buttons-enter:hover
{
background-position: -163px -30px;
}

/* ----- div#companyBox ----- */

div#companyBox
{
float: left;
display: inline;
width: 160px;
height: 106px;
padding: 30px 0 0 0;
}

/* -------------------------------------------------
div#footer
------------------------------------------------- */

div#footer
{
width: 960px;
height: 37px;
padding: 16px 0 0 0;
}

/* ----- div#companyLogo ----- */

div#companyLogo
{
float: left;
display: inline;
width: 110px;
height: 20px;
padding: 9px 0 0 66px;
}

div#companyLogo a
{
display: block;
width: 110px;
height: 20px;
padding: 0;
text-decoration: none; /* Netscape 8.1 */
text-indent: -9999px;
overflow: hidden;
}

div#companyLogo a:focus,
div#companyLogo a:hover
{
background-position: -110px 0;
}

/* ----- div#footer p ----- */

div#footer p
{
float: left;
display: inline;
width: 469px;
line-height: 17px;
padding: 7px 37px 0 70px;
color: #AD9725;
text-align: center;
}

/* ----- div#footerIcons ----- */

div#footerIcons
{
float: left;
display: inline;
width: 180px;
height: 34px;
}

div#footerIcons a
{
float: left;
display: inline;
width: 36px;
height: 34px;
padding: 0;
margin: 0;
text-decoration: none;
text-indent: -9999px;
overflow: hidden;
}

a#firefox:focus,
a#firefox:hover
{
background-position: 0 -34px;
}

a#internetExplorer
{
background-position: -36px 0;
}

a#internetExplorer:focus,
a#internetExplorer:hover
{
background-position: -36px -34px;
}

a#safari
{
background-position: -72px 0;
}

a#safari:focus,
a#safari:hover
{
background-position: -72px -34px;
}

a#delicious
{
background-position: -108px 0;
}

a#delicious:focus,
a#delicious:hover
{
background-position: -108px -34px;
}

a#favorites
{
background-position: -144px 0;
}

a#favorites:focus,
a#favorites:hover
{
background-position: -144px -34px;
}