/* $Id: gigagig-08.css,v 1.1 2009-10-06 18:50:04 jimmy Exp $ */
/*
   ======================================================================
   (c) Copyright 2000-2009 James Stiefel, Gigagig :: All rights reserved.
   ======================================================================
*/

/*
  Colors Colors Colors Colors -- converting to Monarch palette
Text:
        Text:                           #070004;
        background:                     #FFFBD6;
        (bg - 333333 darker background)    #DDD0B4;

Links:
        unvisited links:                #070004;
        visited links :                 #070004;
        hover link:                     #EC4308;
        active links:                   #FC810A;
Nav Menu:
        menu hover background:          #FFAC23;
        menu hover text :               #EC4308;
        menu text:                      #070004;
        menu #lselect a.c:hover text    #1C3193;
Buttons:
       .customNoImageButton background:             #FC810A;
       .customNoImageButton font:                   #070004;
       .customNoImageButton li a:hover  color:      #070004;
       .customNoImageButton li a:hover  background  #EC4308;
       .customNoImageButton li a:active (button down) font:       #070004;
       .customNoImageButton li a:active (button down)  background #EC4308;

Site Divs:
        ie warning background:              #FC810A;
        mainContent background:             #FFFBD6;
        navMap background:                  #FFFBD6;
        .entryItem .entryTracks background: #FC810A;
        .artistInfo background:             #FFFBD6;
        .basicCatalogListing .entryIcon   background:   #070004;
        .graphicMatte background-color:     #DDD0B4;;
        .entryGraphic    background-color:  #070004;
        .entryIcon (thumbnail)font          #070004;
        .entryIcon (thumbnail)background:   #FC810A;

        #myDownloads .infoRow .infoTitle .column1  background:#FC810A;
        #myDownloads .infoRow .infoTitle .column2  background:#FC810A;


General Stuff (mostly older & admin use)
    .listTableTitle font color:                     #070004;
    .listTableTitle   background:                   #EC4308;
    .customInput (form entry) text:                 #303030;
    .customInput (form entry) background:           #EEEEEE;
    .normalRow text:                                #070004;
    .normalRow  background:                         #FFFBD6;
    .invertedRow text  color:                       #FFFBD6;
    .invertedRow  background-color:                 #070004;
    .separator   (border & line) text:              #FFFBD6;
    .separator   (border & line) background-color:  #070004;
    .innerTable     color:                          #070004;
    .innerTable     background-color:               #FFFBD6;

Tasks:
    .taskNoStatus    background:        #BBBBBB;
    .taskReady       background:        #00FF00;
    .taskInProgress  background:        #00CCCC;
    .taskSucess      background:        #00FF00;
    .taskFail        background:        #FF0000;
    .taskSkipped     background:        #DD6060;

artist tabs (not implemented now/yet):
                            background-color:    #990099;
    #artistHomeTab          background-color:    #990000;
    #artistNewzTab          background-olor:     #990000;
    #artistFeaturesTab      background-color:    #990000;
    #artistCatalogTab       background-color:    #990000;
    #artistTabs .selected   background-color:    #009999;

*/




body {
    z-index: 0;
    margin: 0px 0px 0px 0px;
    color:#070004;
    background-color:#FFFBD6;  /* std gigagig bg */
    font: 11px "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
    padding-bottom: 20px;
}

/*  clean slate */
h1 {
    margin: 0px 0px 0px 0px;
    font-weight: bold;
    font-size:   1.3em;
}
h2 {
    margin: 0px 0px 0px 0px;
    border-bottom: 1px solid silver;
    font-weight: bold;
    font-size:   1.2em;
}
h3 {
    margin: 0px 0px 0px 0px;
    font-weight: bold;
    font-size:   1.1em;
}

/*__________Basics__________*/
A:link    {
    color: #070004;  /* unvisited links */
    text-decoration: underline;
}
A:visited {
    color: #070004;  /* visited links   */
    text-decoration: underline;
}
A:hover   {
    color: #EC4308;
    text-decoration: none;
}   /* user hovers: underline  appears   */

A:active  {
    color: #FC810A;    /* active links    */
    text-decoration: none;
}

/*  Text alignment classes */
.textLeft {
    text-align: left;
}
.textRight {
    text-align: right;
}
.textCenter {
    text-align: center;
}

/*****************************************************************************/
/*************      General template elements    *****************************/

/*  page level divs */

/*  warning only shown when running IE 6 or lower, mainly due to lack of PNGtransparencey support*/
#ieWarning{
    background-color:#FC810A;
    height: 40px;
}

#ieWarning span{
    font-weight: bold;
    font-size: 1.1em;
}

/*  the whole page inside the body */
.store #page {
    z-index: 10;
    width: 950px;
    position: relative;
    margin-left: auto;
    margin-right: auto;

    /* horizontal across top for store */
    /*
    background:   transparent url(../../images/gigagig/Wing-gradient2-small-horiz-nq8.png)  left top repeat-x;
    */
}


.admin #page {
    z-index: 10;
    min-width: 1000px;
    /* left vertical for admin */

    /*
    background:   transparent url(../../images/gigagig/Wing-gradient2-small-vert-nq8.png)  left top repeat-y;
    */
}


/*  div id=header */
#header {
    z-index: 75;

    width:  950px;
    height: 150px;
    background:   url(../../images/gigagig/gigagig-header-monarch.png)  left top;
    background-repeat: no-repeat;

}
#headerInner {
}


/*  div id=footer */
#footer {
    clear: both;
    margin-top: 100px;
}

#footerInner {
    text-transform: lowercase;
    text-align: center;
}

#mainContent {
    position: relative;
    float: left;

    margin-top:    15px;
    margin-left:   10px;
    margin-right:  10px;
    margin-bottom: 15px;
}

.store #mainContent {
    width: 560px;
    min-height: 480px;
}

#navMap{
    background-color:#FFFBD6;

}

/******************************************************************************/
/***************************  Site Home styles         ***********************/
#siteHome {
    margin-top: 15px;
}

.atistHome #greeting{
    font-size: 1.3em;
    font-weight: bold;

}
#greeting{
    font-size: 1.3em;
}

#greeting span {
}

/* hide the posting date */
#greeting .postDate {
    display: none;
}

#farewell{
    clear: both;
}

#farewell span {
}

/* hide the posting date */
#farewell .postDate {
    display: none;
}

#banner{
}

/*  hide the instructions */

/* hide the posting date */
#banner .postDate {
    display: none;
}

/*  link to artists's catalog collection */
#collections #collectionsLink{
    display: none;
}

#latestReleases{
   /*  display: none; */
}

#latestReleases span {
  /*   display: none;   */
}



/*  actual artist list */
#artists {
    width: 540px;
}

.artist{
    margin-top: 25px;
}

.artist .graphic {
    float: left;
    margin:  10px;
}
.artist .name{
    width: 300px;
    float: left;
    font-size: 1.5em;
    font-weight: bold;
    margin-top: 30px;

}

.artist A:link    {
    text-decoration: none;
}
.artist A:visited {
    text-decoration: none;
}

.artist .genre{
    float: right;
    text-align: right;
    margin-top: 30px;
    width: 100px;
}

.artist .hometown{
    float: right;
    text-align: right;
    width: 100px;
}

.artist .catalogCounts{
     clear: both;
}

.artist  .description{
     clear: both;
}

#news{
    clear: both;
    margin-bottom: 50px;
}

/*  a news item on the artist/label home page  */
.newsItem {
    padding-top: 20px;
    clear: both;
}
.newsItem .newzTitle {
    font-size: 1.4em;
    font-weight: bold;
    border-bottom: solid #070004 medium;
}

.newsItem h1 { }
.newsItem p { }
.newsItem .postDate {
    display:none;
    float: right;
    width: 200px;
    text-align: right;
}


/*  a catalog entry item on the artist/label home page  */
.entryItem {
    clear: both;
    margin-top: 20px;
    margin-bottom: 5px;
    height: 100%;
}

.newsItem .entryItem {
    margin-left: 10px;
    border: 1px solid  #070004;
    margin-bottom: 5px;
    margin-right: 5px;
    padding: 7px 10px 3px 7px;
    float: left;
    height: 100%;
}

div.newsItem div.entryItem div.liveShow{
    width: 550px;
}
div.newsItem div.entryItem div.album{
    width: 275px;
}
.newsItem .entryItem .album .entryTracks {
    display: none;
}

.newsItem .entryItem  .entrySummary {
    margin-bottom: 10px;
}

.newsItem  div.entrySummary div.entryTitle{
    border-bottom:1px solid #070004;
    margin-bottom:5px;
    padding-bottom:2px;
}


div.newsItem div.entryItem div.entrySummary div.buyButtons{
    clear: none;
    float: right;
    margin-top:   0px;
    margin-bottom:3px;
    margin-left:  0px;
    margin-right: 5px;
}

.newsItem .entryItem .liveShow .entrySummary .entryTracks {
    float: left;
    width: 90%;
    margin:0px 0px 0px 10px;
    padding:0px;
    border:1px solid #070004;
    display:inline-block;
}

/* Summarry contains title, icon, buy buttons  - we will stack vertical  */
.entryItem .entrySummary {;
}

.entryItem .entryTitle {
    font-size: 1.2em;
    font-weight: bold;
}

.entryItem .entryTitle A:link,
.entryItem .entryTitle A:visited
{
    text-decoration: none;
}

.entryItem .entryIcon {
    clear: left;
    float: left;
    font-size: .7em;
}

.entryItem .entryIcon span{
    display: none;
}


.entryItem .buyButtons {
    /* float: left; */
}

.entryItem  .customNoImageButton{
    margin-left: 10px;
    margin-top:   5px;
    width:  160px;
}

.buyButtons span {
    display: inline;
}

.buyButtons span .prices{
    display: inline;
}


/*  tracks - div after summary.  contains two half setlists which we'll try to float side by side, or new short setlist. */
.entryItem .entryTracks {
    clear: left;
    margin-left: 3px;
    margin-top: 10px;
    margin-bottom: 20px;
    width: 500px;
}

.entryItem .entryTracks span{
    font-weight: bold;
}

/* float first & second side by side */
.entryItem .firstHalfTracks {
    float: left;
}
.entryItem .secondHalfTracks {
    float: left;
    margin-left: 10px;
    border-left: 1px dotted #070004;

}

/*  the inner chunk -- define width here */
.entryItem .halfTracklist {
    width: 200px;
}

/*  just track title,  so it can define it's own width up to parent width  */
.entryItem .trackTitle{
    float: left;
    width: 195px;
    font-size:   1.0em;
}

#leftColumn   .entryIcon,
#rightColumn  .entryIcon{
    float: left;
    word-wrap: break-word;

    margin-left: 4px;
    margin-top: 4px;
}

#leftColumn    .searchForm .formField,
#rightColumn   .searchForm .formField {
    clear: both;
    margin-left:  4px;
    width:  130px;
}

#leftColumn    .searchForm .formField .customInput,
#rightColumn   .searchForm .formField .customInput{
    width:  126px;
}


#leftColumn    .searchForm .customNoImageButton,
#rightColumn    .searchForm .customNoImageButton{
    clear: both;
    margin-left:  4px;
    width:  130px;
}

.artistIcon {
    position: relative;
    background-color:#DD0000;
    height:80px;
    width:80px;
    margin-left: 15px;
    margin-top: 5px
    margin-right: 10px;
    margin-bottom: 5px
}

/*  an artist's info block on the artist list page */
#artistList .artistInfo{
    background-color:#DD00DD;
    min-width: 250px;
}

/*  an artist's features block on the artist list page */
#artistList .artistFeatures {
    background-color:#FF00FF;
    max-height: 150px;
}

#artistBanner{
}

/*************  end General template elements    *****************************/
/*****************************************************************************/


/*****************************************************************************/
/*********   navigation menu -- thanks for the inspiration zen garden!   *****/

/************   Container for menues, features, etc - so it can expand   *****/

#leftColumn{
/*
    position: relative;
	top:-10px;
	left:-10px;
*/
    padding-left: 10px;
    padding-top: 10px;
    clear: both;
    float: left;
    width: 150px;
/*    position: fixed;  */
}

#rightColumn{
    position: relative;
    top: 0px;
	right: 0px;
    float: right;
    width: 160px;
}

/*****************************************************************************/
/*************    begin navigation menu          *****************************/
/*  Menu style -- this is pretty involved -- thanks zen garden! */
/* ----- Navigation Menus  -----*/

/* Navigation menu container */
#navMenu {

    padding-top: 10px;

    /*  move front  */
    z-index: 30;

    width: 140px;

    font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.0em;
    font-weight: bold;
    text-align: left;
}

/* hide unwanted navigation destinations here */
#navMenu  #navLabelHome   {}`
#navMenu  #navArtistHome  {}
#navMenu  #navMusicStore  {}
#navMenu  #navBands       {}
#navMenu  #navCatalog     {}
#navMenu  #navMyDownloads {}
#navMenu  #navMyAccount   {}
#navMenu  #navCheckout    {}
#navMenu  #navSupport     {}
#navMenu  #navRadio       { display: none; }
#navMenu  #navContact     {}
#navMenu  #navAbout       {}


#navMenu h3 {
    height: 26px;
    margin: 0;
}

#navMenu h3 span {
  /*  display: none; */
}

/* h3 text-replacing images */
#navMenu h3.menuTop {
    background: url(../../images/gigagig/BG_h3menuTop.gif) top left no-repeat;
    font-size: 1.0em;
}

#navMenu h3.menuBottom {
    background: url(../../images/gigagig/BG_h3menuBottom.gif) top left no-repeat;
}

#navMenu h3.select {
    background: url(../../images/gigagig/BG_h3select.gif) top left no-repeat;
}

#navMenu ul {
    list-style: none;
    padding: 0 0 0 0;
    margin: 0;
    line-height: 3px; /* controls height of navMenu li */
}

#navMenu ul li {
    padding: 2px 0px 2px 0px;
    margin: 0;
    border-bottom: dotted 1px #070004;
}

/* can have a hover effect here by changing some parameters - color, width, line-type */
#lselect li:hover {
    border-bottom: dotted 1px #070004;
    background-color: #FFAC23;
}

#navMenu #lselect {
    font-style:italic;
    color: #070004;
    /* margin-bottom: 4px; */
}

#navMenu #lselect li {
    padding-top: 4px;  /* control padding at top of li in navMenu (menu item) */
}

#navMenu #lselect a:link, #navMenu #lselect a:visited {
    display: block;
    font: normal 1.0em "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;

/* not sure why doing these individually doesn-t work -- they get all smooshed

    font-weight: bold;
    font-size:  0.9em;
    font-faily: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
*/
    color: #070004;
    text-decoration:none;
    padding: 0px 0px 0px 14px;
    background: url(../../images/gigagig/BG_li.gif) top left no-repeat;
}

#navMenu #lselect a:hover {

    font-weight: bold;
    font-size:  1.0em;

    color: #EC4308;
    text-decoration: none;
    /* change padding to have it move over */
    padding: 0px 0px 0px 14px;
    background: url(../../images/gigagig/BG_li_hover.gif) top left no-repeat;
}

#navMenu #lselect a.c, #navMenu #lselect a.c:visited  {
    display: inline;
    margin-bottom: 0px;
    padding: 0;
    font-weight: normal;
    font-size: 1.0em;
    color: #070004;
    border: 0;
    text-decoration: none;
    background: none;
}

#navMenu #lselect a.c:hover  {
    display: inline;
    padding: 0;

    font-weight: normal;
    font-size: 1.0em;

    color: #1C3193;
    border: 0;
    text-decoration: none;
    background: none;
}

/*************      end navigation menu          *****************************/
/*****************************************************************************/


/*****************************************************************************/
/*************      begin artist list navigation   *****************************/

/* Navigation menu container */
#artistNav {

    display: block;
    clear: both;

    padding-top: 10px;

    /*  move front  */
    z-index: 30;

    width: 140px;

    font-family: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.0em;
    font-weight: bold;
    text-align: left;
}

#artistNav h3 {
    height: 26px;
    margin: 0;
}

#artistNav h3 span {
  /*  display: none; */
}

/* h3 text-replacing images */
#artistNav h3.menuTop {
    background: url(../../images/gigagig/BG_h3menuTop.gif) top left no-repeat;
    font-size: 1.0em;
}

#artistNav h3.menuBottom {
    background: url(../../images/gigagig/BG_h3menuBottom.gif) top left no-repeat;
}

#artistNav h3.select {
    background: url(../../images/gigagig/BG_h3select.gif) top left no-repeat;
}

#artistNav ul {
    list-style: none;
    padding: 0 0 0 0;
    margin: 0;
    line-height: 3px; /* controls height of artistNav li */
}

#artistNav ul li {
    padding: 2px 0px 2px 0px;
    margin: 0;
    border-bottom: dotted 1px #070004;
}

/* can have a hover effect here by changing some parameters - color, width, line-type */
#artistSelect li:hover {
    border-bottom: dotted 1px #070004;
    background-color: #FFAC23;
}

#artistNav #artistSelect {
    font-style:italic;
    color: #070004;
    /* margin-bottom: 4px; */
}

#artistNav #artistSelect li {
    padding-top: 4px;  /* control padding at top of li in artistNav (menu item) */
}

#artistNav #artistSelect a:link, #artistNav #artistSelect a:visited {
    display: block;
    font: normal 1.0em "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;

/* not sure why doing these individually doesn-t work -- they get all smooshed

    font-weight: bold;
    font-size:  0.9em;
    font-faily: "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
*/
    color: #070004;
    text-decoration:none;
    padding: 0px 0px 0px 14px;
    background: url(../../images/gigagig/BG_li.gif) top left no-repeat;
}

#artistNav #artistSelect a:hover {

    font-weight: bold;
    font-size:  1.0em;

    color: #EC4308;
    text-decoration: none;
    /* change padding to have it move over */
    padding: 0px 0px 0px 14px;
    background: url(../../images/gigagig/BG_li_hover.gif) top left no-repeat;
}

#artistNav #artistSelect a.c, #artistNav #artistSelect a.c:visited  {
    display: inline;
    margin-bottom: 0px;
    padding: 0;
    font-weight: normal;
    font-size: 1.0em;
    color: #070004;
    border: 0;
    text-decoration: none;
    background: none;
}

#artistNav #artistSelect a.c:hover  {
    display: inline;
    padding: 0;

    font-weight: normal;
    font-size: 1.0em;

    color: #1C3193;
    border: 0;
    text-decoration: none;
    background: none;
}


#artistNav .graphic {
    display: none;
}

/*************      end artist list navigation   *****************************/
/*****************************************************************************/

/*  div id=searchBar */
#searchBar {

}

#header #loginForm{
    float:    right;
    /* top, right, bottom, left */
    margin: 3px 10px  7px  7px;
    padding:  1px;

    text-align: right;
    border-left: 1px solid #070004;
    width: 200px;
}

#rightColumn #loginForm{
    text-align: right;
    border-left: 1px solid #070004;
    width: 160px;
}


#loginForm .formRow{
    float: left;
}

#loginForm .formLabel{
    clear: all;
    float: left;
    /* top, right, bottom, left */
    margin: 4px 2px 4px 7px;
    text-transform: lowercase;
}

#loginForm .formField{
    float: right;
    /* top, right, bottom, left */
    margin: 4px  4px  4px auto;
}

#loginForm .customNoImageButton{
    float: right;
    width: 100px;

    /* top, right, bottom, left */
    padding: 0px 5px;
    margin: 0px 0px 4px auto;
}

#receipt .customNoImageButton{
    width: 200px;
    margin-left: auto;
    margin-right: auto;
}

#header .loggedIn {
    float: right;
    width: 150px;
    margin: 20px 0px 5px 5px;
    padding: 3px;
    /* border-left: 1px solid #070004; */
    text-align: right;
}
#mainCOntent .loggedIn {
    float: left;
    width: 250px;
    margin-top: 20px;
    margin-left: auto;
    margin-right: auto;
    padding: 3px;
}
.searchForm{
    margin-top: 20px;
    margin-right: 5px;
    width: 155px;
}

#leftColumn    .searchForm {
    clear: both;
    display: block;
}
#rightColumn   .searchForm { display: none; }
#header        .searchForm { display: none;  }

#features {
    float: left;
    clear: both;
    margin-top: 30px;
    width: 155px;
    min-height: 270px;
}

#recentAdditions {
    float: left;
    clear: both;
    margin-top: 15px;
    width: 155px;
}

#topDownloads{
    float: left;
    clear: both;
    width: 155px;
    min-height: 270px;
}

/* MS IE shows the break making thumbnail margin uneven */
 .entryIcon br {
    display: none;
}

/*************      end left column              *****************************/
/*****************************************************************************/

/*****************************************************************************/
/************* Special Button widths      *****************************/

.entryTracks .customNoImageButton{
    clear: both;

    margin-left: auto;
    margin-right: 5px;
    margin-top:   5px;

    width: 230px;
}



/*************    Special Button widths       *****************************/
/*****************************************************************************/


/*****************************************************************************/
/*************       Artist Tabs elements        *****************************/

/*  tabs in the artists section */
#artistTabs {
    /*  move front  */
    z-index: 20;
    background-color:#990099;
}

    /* tab when it is not the active one */
    #artistHomeTab{
        background-color:#990000;
    }
    #artistNewzTab{
        background-color:#990000;
    }
    #artistFeaturesTab{
        background-color:#990000;
    }
    #artistCatalogTab{
        background-color:#990000;
    }

    /* when a tab is the active one, add class=selected */
    #artistTabs .selected{
        background-color:#009999;
    }

/*************    end Artist Tabs elements       *****************************/
/*****************************************************************************/


/*****************************************************************************/
/*************       Artist Home elements        *****************************/

/*  class=artistInfo -- just defines styles, not position */

.artistInfo{
    background-color:#FFFBD6;
    font-weight: normal;
    font-size:   1.0em;
}

/* artist info detail classes artistInfo  -- define a style inside a parent*/

div.artistInfo div.artistName{
    padding: .5em .8em .6em .8em;
    font-weight: bold;
    font-size: 1.2em;
}
div.artistInfo div.artistLogo{
    padding: .5em .8em .6em .8em;
    font-weight: bold;
    font-size: 1.2em;
}
div.artistInfo div.artistCatalog, div.artistInfo div.artistCatalog A{
    padding: .5em .8em .6em .8em;
    font-weight: bold;
    font-size: 1.2em;
}
div.artistInfo div.artistMerch, div.artistInfo div.artistMerch A{
    padding: .5em .8em .6em .8em;
    font-weight: bold;
    font-size: 1.2em;
}
div.artistInfo div.artistHomepage, div.artistInfo div.artistHomepage A{
    padding: .5em .8em .6em .8em;
    font-weight: bold;
    font-size: 1.2em;
}
div.artistInfo div.artistMedia, div.artistInfo div.artistMedia A{
    padding: .5em .8em .6em .8em;
    font-weight: bold;
    font-size: 1.2em;
}
div.artistInfo div.artistContact, div.artistInfo div.artistContact A{
    padding: .5em .8em .6em .8em;
    font-weight: bold;
    font-size: 1.2em;
}

#artistHomeNewz {
}

/* a single featured release on an artists home page */
.artistHomeRelease {
}
/* under the artist features */
#artistHomeBottom {
}

/*************     end Artist Home elements      *****************************/
/*****************************************************************************/


/*****************************************************************************/
/*************     Basic Catalog elements    *********************************/

#basicCatalogList {
}

.basicCatalog{
    display: block;
    clear: both;
}

.basicCatalogGraphic {
}

.basicCatalogTitle{
    display: block;
}

.basicCatalogTitle  a:link,
.basicCatalogTitle  a:visited {
    text-decoration: none;
}

.basicCatalogTitle h2{
    /* top, right, bottom, left */
    margin-top: 10px;
    margin-bottom: 5px;

    font-weight: bold;
    font-size:   1.4em;
    letter-spacing: -1px;
}

/**************************************************/
/**********  Thumbnail-only list    ***************/

.basicCatalogThumbnails{
/*    display: none ; */
    float: left;

    margin-left: 30px;
    margin-right: 30px;

    min-width: 500px;
}

.basicCatalogThumbnails .entryIcon  {
    float: left;
    word-wrap: break-word;
    min-width:  40px;
    min-height: 40px;
}


.basicCatalogThumbnails .entryIcon span {
    /*     display: none; */
}


/*****************************************************/
/*  text-only or text+icon  catalog entry title list */

.basicCatalogListing{
    display: block;
    float: left;
    padding-bottom: 10px;
}

.basicCatalogListing .entryTitleContainer{
    clear: both;

    /* top, right, bottom, left */
    margin: 2px 10px 2px 10px;
}


.basicCatalogListing  .entryIcon  {
    display: none;

    clear: both;
    float: left;
    word-wrap: break-word;
    min-width:  40px;
    min-height: 40px;
    margin-left: 15px;
    margin-top: 5px;
    padding: 0px;
}

#basicCatalogListing .entryIcon span {
    font-size:  .7em;
    /* display: none */
}

.basicCatalogListing  .entryTitle{
    clear: both;
    float: left;
    display: block;

    font-weight: bold;
    font-size: 1.1em;
    height: 25px;

    padding-left: 20px;

    /* top, right, bottom, left */
    margin: 2px 15px 2px 5px;
}

/*************     end Basic Catalog elements     ****************************/
/*****************************************************************************/

/*****************************************************************************/
/****   Detailed Catalog elements  - like news setlist listing entry   *******/

/*  this is basically what entryItem is ... */

#detailedCatalogList {
}

.detailedCatalog{
    display: block;
    clear: both;
    background-color: #FFFBD6;
    border: 1px solid #070004;
}

.detailedCatalogTitle{
    display: block;
    /* top, right, bottom, left */
    margin: 30px auto 10px auto;
}

.detailedCatalogEntry{
    display: block;
    width: 500px;
    border: 1px solid #070004;
}

.detailedCatalog li {
    list-style-type: none;
    clear: both;
}

/*  .entryItem has the setlist, buy buttons, etc. */

/*************     end Detail Catalog elements     ****************************/
/*****************************************************************************/



/*****************************************************************************/
/*************     Catalog Entry elements        *****************************/

#catalogEntry {
}

#catalogEntry .entrySummary{
    float: left;
	margin-bottom: 10px;
    width: 710px;
}
#catalogEntry .entrySummary .graphicMatte {
	padding:7px;
}

#catalogEntry  .entryTitle{
    margin-top: 5px;
    margin-left: 15px;
    font-weight: bold;
    font-size: 1.3em;
}

.entryGraphic{
    float: left;
    min-width: 350px;
    margin-left: 15px;
    margin-top:  10px;
}

#entryInfo{
    float: right;
     /* top, right, bottom, left */
    margin: 10px
    padding: 5px;
    width: 290px;
    min-height:300px;
}

#entryInfo .customNoImageButton {
    width: 250px;

    margin-left: 15px;
    margin-top:   5px;
}


#entryBlurb{
    clear: both;  /* this gets back to normal after floats */
    /* top, right, bottom, left */
    margin: 20px 5px 5px 5px;
}

#entryGuests{
    display: block;

    /* top, right, bottom, left */
    margin: 5px 5px 5px 5px;
}

#entryNotes{
    /* top, right, bottom, left */
    margin: 15px 5px 5px 5px;
}

#entryGuests{
    display: block;
    margin-top: 20px;
}

#catalogEntry .entryTracks {
    float: left;
    padding-left: 5px;
    padding-right: 5px;
    padding-bottom: 15px;
    width: 410px;
}

#catalogEntry form {
    margin-left: auto;
    margin-right: auto;
}

/* side by side setlist */
#catalogEntry .firstHalfTracks {
    float: left;
    margin-left: auto;
    margin-right: auto;
}
#catalogEntry .secondHalfTracks {
    float: left;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 5px;
    border-bottom: 2px solid silver;
}

/*  holds tracks which hold titles, etc all w/ well defined widths,  so use computed */
#catalogEntry .entryTracks .halfTracklist{
}

/*  to make one column,  hide these second titles */
#catalogEntry  .secondHalfTracks .trackTitles {
   display: none;
}

.trackTitles{
    padding: 1px;
    text-transform: uppercase;
    font-weight: bold;
    font-size: .8em;
    padding-botton: 2px;
	height: 31px;
}

.setTitle{
    clear: both;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 1.1em;
    height: 19px;
	margin: 5px 0 0;
    padding: 1px;
    padding-top: 4px;
    border-top: 2px solid silver;
    border-bottom: 2px solid silver;
    background-color: #FFAC23;
}


/*  370 px wide with 2 encodings.  add 35px per encoding */
.track{
    clear: both;  /* back to left after floats */
    padding: 1px;
    font-weight: normal;
    font-size: 0.9em;

	border-top: 1px solid silver;
	line-height: 11px;
	height: 22px;
}

.trackPreview{
    float: left;
    width: 35px;
}


/* has to live with preview, checkboxes, etc */
#catalogEntry .trackTitle{
    float: left;
    width: 240px;
}

.trackLength{
    float: left;
    text-align: right;
    width: 30px;
}

.trackBuyBoxes{
    float: left;
    text-align: center;
   /*  width: 120px; */
    margin-left: 5px;
}

.trackBuyBox{
    float: left;

    margin-left: 10px;
    margin-right: 5px;

    width: 20px;
    text-align: center;
}



/*************     end Catalog Entry elements    *****************************/
/*****************************************************************************/

/*****************************************************************************/
/*************        Shopping Cart styles        ****************************/
.shoppingCart {
    width: 650px;
}
.shoppingCart .innerTable{
    width: 640px;
}
.shoppingCart .innerTable td{
    padding: 2px;
}
.shoppingCart .customNoImageButton{
    width: 175px;
}

/*************       End Shopping Cart styles     ****************************/
/*****************************************************************************/


/*****************************************************************************/
/*************          Slide show styles         ****************************/


#slideShow #stopButton {
    float: left;
}
#slideShow #playButton {
    float: left;
}
#slideShow #prevButton {
    float: left;
}
#slideShow #nextButton {
    float: left;
}

/*************       End Slide show styles         ***************************/
/*****************************************************************************/

/*****************************************************************************/
/*******   begin contacts (and prototype of generic table-ish divs)    *******/

/*  a row of data */
#contacts .infoRow {
    height: 40px;
    width:  500px;
    margin-left: auto;
    margin-right: auto;
}

#contacts .infoRow span {
    font-size: .8em;
}


/*  a row that is a title - bigger, bolder */
#contacts .infoRow .infoTitle{
    font-weight: bold;
    font-size: 1.3em;
    text-transform: uppercase;
    text-align: center;
}

#contacts .infoRow .infoTitle .column1,
#contacts .infoRow .infoTitle .column2{
    text-align: center;
}

#contacts .column1{
    width: 160px;
    text-align: left;
    font-weight: bold;
}

#contacts .column2{
    width: 200px;
    text-align: left;
}

.column1{
    clear: both;
}
.column1, .column2, .column3, .column4, .column5, .column6, .column7{
    float: left;
}

.form .column1 {
    width: 200px;
}

#services,
#philosophy,
#about {
    width:  500px;
}


/*******   end contacts (and protot1ype of generic table-ish divs)    *********/
/*****************************************************************************/

/*****************************************************************************/
/***********************   Begin myDownloads    ********************************/

/*  a row of data */
#myDownloads .infoRow {
    width:       600px;
    min-height:  20px;
    margin-left:  auto;
    margin-right: auto;
}

/*  a row that is a title - bigger, bolder */
#myDownloads .infoRow .infoTitle{
    text-align: center;
    border-top:    #070004 2px solid;
    border-bottom: #070004 1px solid;
    margin-top:    15px ;
}

#myDownloads .infoRow .infoTitle .column1 {
    width: 500px;
    background-color:#FC810A;
    font-weight: bold;
    font-size:   1.2em;
    letter-spacing: 0;
    text-align: center;
    text-transform: uppercase;
}
#myDownloads .infoRow .infoTitle .column2{
    width: 100px;
    background-color:#FC810A;
    font-weight: bold;
    font-size:   1.2em;
    letter-spacing: 0;
    text-align: center;
    text-transform: uppercase;
}

#myDownloads .infoRow .entryTitle {
    margin-top: 15px;
    margin-bottom: 5px;
    margin-left: 10px;
    text-align: left;
    line-height: 3ex;
    height:  25px;
    font-size: 1.2em;
    font-weight: bold;
}
#myDownloads .infoRow .entryTitle .column1 {
    text-align: left;
    font-size:   1.2em;
    font-weight: bold;
    margin-left: 0px;
    width: 325px;
}
#myDownloads .infoRow .entryTitle .column2 {
    text-align: right;
    width: 75px;
    font-size: .9em;
    font-weight: normal;
}
#myDownloads .infoRow .entryTitle .column3 {
    text-align: right;
    width: 75px;
    font-size: .9em;
    font-weight: normal;
}
#myDownloads .infoRow .entryTitle .column4 {
    text-align: center;
    width: 100px;
    font-size: .9em;
    font-weight: normal;
}
#myDownloads .infoRow .zipRow {
    min-height: 18px;
    margin-bottom: 14px;
}

#myDownloads .infoRow .zipRow .customNoImageButton {
    /* top, right, bottom, left */
    margin: -7px auto 0px 0px;
    padding: 0px;
    width: 200px;
}

#myDownloads .infoRow .zipRow .column1{
    text-align: left;
    margin-left: 25px;
    width: 250px;
}
#myDownloads .infoRow .zipRow .column2{
    text-align: right;
    font-size: .9em;
    width: 125px;
}
#myDownloads .infoRow .zipRow .column3{
    text-align: right;
    font-size: .9em;
    width: 75px;
}
#myDownloads .infoRow .zipRow .column4{
    text-align: center;
    font-size: .9em;
    width: 100px;
}

#myDownloads .infoRow .trackRow{
    /* border-bottom: #070004 1px dotted;  */
    font-size:  .8em;
    height:  15px;
}
#myDownloads .infoRow .trackRow .column1{
    text-align: left;
    margin-left: 25px;
    width: 300px;
}
#myDownloads .infoRow .trackRow .column2{
    text-align: center;
    width: 75px;
}
#myDownloads .infoRow .trackRow .column3{
    text-align: right;
    width: 75px;
}

#myDownloads .infoRow .trackRow .column4{
    text-align: center;
    width: 100px;
}

#myDownloads .infoRow .expiredRow .column1{
    text-align: left;
    margin-left: 10px;
    width: 265px;
}
#myDownloads .infoRow .expiredRow .column2{
    text-align: right;
    width: 50px;
}
#myDownloads .infoRow .expiredRow .column3{
    text-align: center;
    width: 75px;
}

#myDownloads .infoRow .expiredRow .column4{
    text-align: center;
    width: 75px;
}

#myDownloads .infoRow .expiredRow .column5{
    text-align: center;
    width: 100px;
}

/***********************   end myDownloads    ********************************/
/*****************************************************************************/

/*************************** My Account **********************************/
#myAccount #accountInfo{
    float: left;
    margin-left: 20px;
    margin-right: 20px;
}

#myAccount #orderHistory{
    float: left;
}

#myAccount #accountInfo .infoRow {
    width:       175px;
    min-height:  20px;
    margin-top: 4px;
}

#myAccount #orderHistory .infoRow {
    width:       250px;
    min-height:  20px;
}

#myAccount .formLabel {
    text-align: right;
}

div#myAccount div.title{
    margin-top: 10px;
    margin-bottom: 5px;
    margin-left: 10px;
    text-align: left;
    line-height: 3ex;
    height:  25px;
    font-size: 1.1em;
    font-weight: bold;
}

#myAccount #orderHistory .infoRow .column1{
    width:  80px;
    text-align: center;
    margin
}
#myAccount #orderHistory .infoRow .column2{
    width:  90px;
    text-align: center;
}
#myAccount #orderHistory .infoRow .column3{
    width:  80px;
    text-align: right;
}


/*************************** End My Account **********************************/

div#showInvoice {
    border: 1px solid #070004;
}

div#showInvoice th {
    border-bottom: 1px solid #070004;
}

#manageSubscriptions table{
    margin-left: auto;
    margin-right: auto;
}
/*****************************************************************************/
/***************************    Support     **********************************/

#support h2 {
    font-size:1.3em;
    text-align: center;
}

#support h3 {
    font-size:1.2em;
    text-align: center;
}

.container {
    clear: both;
    padding-top: 20px;
    height: 120px;
}

.container  .subNav {
    margin-left: 20px;
    margin-top: 25px;
}

.subNav .customNoImageButton {
    float: left;
    width: 150px;
    margin-left: 20px;
    margin-right: 0px;
}

#support .normalTable {
    margin-left: 30px;
}
#support .normalTable td {
    padding-left: 10px;
    padding-right: 10px;
}

#support #downloadGuide,
#support #FAQ,
#support #software{
}

#downloadGuide ul{
    list-style-position: outside;
    list-style-type: decimal;
}
#downloadGuide li{
    padding-bottom: 21px;
}

/*************       End  Support styles         ***************************/
/*****************************************************************************/

/*****************************************************************************/
/*************     begin General Utility Classes  ****************************/

/* Dark title for slick display lists */
.listTableTitle{
    font-weight:  bold;
    color:#070004;
    background-color:#EC4308;
}

.normalTable {
    border-color: #070004;
    border-style: solid;
    border-width: 1px;
}

/* Form Styles */
.formLabel{
    font-weight:  bold;
}

.formField{
    float: left;
    /* top, right, bottom, left */
    margin: 4px  auto 4px  4px;
}

/* input holes */
.customInput {
    color: #303030;
    background-color:#EEEEEE;
}


/*  Older Styles */

.normalRow {
    color:#070004;
    background-color:#FFFBD6;
}
.invertedRow {
    color:#FFFBD6;
    background-color:#070004;
}

/* border & line color */
.separator {
    color:#FFFBD6;
    background-color:#070004;
}

.innerTable{
    color:#070004;
}

.normalText {
    font: 11px "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
}

.emphasisBodyText {
    font: 12px bold "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
}

.deemphasisBodyText {
    font: 10px bold "Lucida Grande", Verdana, Arial, Helvetica, sans-serif;
}


.noWrap {
    white-space:nowrap;
}

.clear {
    clear: both;
}

/*  Task status color coding */
.taskNoStatus {
    background-color:#BBBBBB;
}
.taskReady {
    background-color:#00FF00;
}
.taskInProgress {
    background-color:#00CCCC;
}
.taskSuccess {
    background-color:#00FF00;
}
.taskFail {
    background-color:#FF0000;
}

.taskSkipped {
    background-color:#DD6060;
}

/*  baseline thumbnail frame */
.entryIcon {
    font-size:  .6em;

    padding:     0px;
    margin-left: 3px;
    margin-top:  2px;
}
.entryIcon span {
    display:none;
}
.imageCaption {
    font-weight: bold;
    font-size: 1.0em;
    text-align:center;
}

.imageCredit {
    font-weight: normal;
    font-size: 0.8em;
    text-align:right;

}

/*   dropshadows    */
.dropShadow{
	float:left;
	clear:left;
    background-color: #FFFBD6;  /*  IE draws white without this */
	background: transparent url(../../images/shadowAlpha.png) no-repeat bottom right !important;
	background: transparent url(../../images/shadow.gif) no-repeat bottom right;
	margin: 5px 0px 5px 5px !important;
	margin: 5px 0px 5px 5px;
}
.dropShadow .graphicMatte{
    background-color:  #DDD0B4;

	position:relative;
	bottom:6px;
	right: 6px;
	border: 1px solid #999999;
	padding:4px;
	margin: 0px;
}
.dropShadow .graphicMatte{
	/* IE5 hack - gawd only knows*/
	\margin: 0px 0px -3px 0px;
	ma\rgin:  0px 0px 0px 0px;
}

/*   ********** image-less button   **********   */

/*  simple flat boxy buttons  */
.customNoImageButton  {
    /*  height: 25px; */
    /*  width: 120px; */
    /* padding: 3px 15%; */
    padding: 0;
    line-height: 25px;
    height: 30px;
}
.customNoImageButton ul  {

    text-transform: lowercase;
    text-align: center;

    font-size: 1.1em;

    list-style: none;
    padding: 0;
    margin: 0;
}
.customNoImageButton ul li  {
    /* top, right, bottom, left */
    padding: 0;
    margin: 0;
}
.customNoImageButton li a  {
    font-size: 1.2em;
    white-space:nowrap;
    padding: 0;
    margin: 0px;
    background-color: #FC810A;
    color: #070004;
}
.customNoImageButton li a:link,
.customNoImageButton li a:visited{
    display: block;
    padding: 0;
    text-decoration: none;
    font-weight: normal;
}
.customNoImageButton li a:hover  {
    padding: 0;
    border: 1px dotted silver;
    text-decoration: none;
    font-weight: bold;
    color:  #070004;
    background-color: #EC4308;
}
.customNoImageButton li a:active  {
    padding: 0;
    border: 1px dotted silver;
    text-decoration: none;
    font-weight: bold;
    color: #070004;
    background-color: #EC4308;
}

/*
     A very 'normal' 3D button look

.customNoImageButton ul {
    margin: 0px;
    padding: 0px;
    font-family: Verdana, Arial, Helvetica, sans-serif;
    font-size: 1.2em;
    line-height: 20px;
}
.customNoImageButton li {
    list-style-type: none;
    height: 21px;
    margin: 5px;
    text-align:center;
}
.customNoImageButton li a {
    text-decoration: none;
    height: 100%;
    width: 100%;
    display: block;
    background-color: #999999;
    border-style: solid;
    border-bottom-color: #333333;
    border-right-color: #555555;
    border-left-color: #BBBBBB;
    border-top-color: #DDDDDD;
}
.customNoImageButton li a:link {
    color: #070004;
    font-weight: bold;
    background-color: #999999;
    border-style: solid;
    border-bottom-color: #333333;
    border-right-color: #555555;
    border-left-color: #BBBBBB;
    border-top-color: #DDDDDD;
}
.customNoImageButton li a:visited {
    color: #070004;
    font-weight: normal;
    background-color: #999999;
    border-style: solid;
    border-bottom-color: #333333;
    border-right-color: #555555;
    border-left-color: #BBBBBB;
    border-top-color: #DDDDDD;
}
.customNoImageButton li a:hover {
    font-weight: bold;
    color: #FFFBD6;
    background-color: #777777;
    border-style: solid;
    border-bottom-color: #333333;
    border-right-color: #555555;
    border-left-color: #BBBBBB;
    border-top-color: #DDDDDD;
}
.customNoImageButton li a:active {
    font-weight: bold;
    color: #FFFBD6;
    background-color: #666666;
    border-style: solid;
    border-top-color: #333333;
    border-left-color: #555555;
    border-right-color: #BBBBBB;
    border-bottom-color: #DDDDDD;
}

*/

/*************     end   General Utility Classes  ****************************/
/*****************************************************************************/

/*****************************************************************************/
/***********************    Begin Error  Classes  ****************************/

#error {
    margin-left: 50px;
}

/****************     end  Error Utility Classes  ****************************/
/*****************************************************************************/

/*****************************************************************************/
/***********************    Begin Admin  Classes  ****************************/
.admin {
    width: 120pc0px;
}

.admin #mainContent {
    width: 800px;
    min-height: 480px;
}
.admin #lookupAccount {
    width: 800px;
}

.admin .newzList {
    margin-top: 40px;
    border-top: 4px solid black;
}
.admin .newzList .newsItem{
    margin-top: 15px;
    border: #070004 solid 1px;
    min-height: 20px;
}

.admin .newzList .newsItem  .createDate,
.admin .newzList .newsItem  .postDate {
    float: right;
    width: 200px;
    text-align: right;
}

.admin .newzList .newsItem .newzTitle {
    margin-top: 25px
    font-size: 1.1em;
    font-weight: bold;
    border-bottom: solid #070004 1px;
}

.admin .newzList .entryItem {
    margin-left: 25px;
    float: none;
}


.admin .newzList .entryItem .entryTitle {
    font-size: 1.0em;
    font-weight: normal;
}

.admin #memberAccount {
    width: 800px;
}
.admin #memberAccount  .memberInfo{
    width:250px;
    float: left;
}

.admin #memberAccount .downloads{
    width:550px;
    float right;
}

.admin #showAllBands td {
    white-space: nowrap;
}
/***********************    End  Admin  Classes   ****************************/
/*****************************************************************************/