@charset "utf-8";

/* ////////////////////////////////M A S T E R  S T Y L E S //////  outline: 1px dotted #FFF; /*/
* {
margin: 0;
padding: 0;
}

body {
font-family: Arial, Helvetica, sans-serif;
font-size: 62.5%;
text-align: center;
color: #1E1E1E;
background: #000;
}

/* for validation purposes prevents any images using the deprecated border attribute */
img, a img {
border:none;
}

/* /////////////////////////////////// M A I N  P U P P I E S ////////////////////////////////*/

#Holder {
width: 970px;
margin: 0px auto auto auto;
text-align: left;
color: #1E1E1E;
background: #000;
border-left: 15px #111 solid;
border-right: 15px #111 solid;
}

#home div#Holder {
background: #000 url('../images/home.jpg') no-repeat top center; 
}
#introduction div#Holder {
background: #000 url('../images/back7.jpg') no-repeat 5% 30%;
}
#approach div#Holder {
background: #000 url('../images/back3.jpg') no-repeat 160% 90%; 
}
#music div#Holder {
background: #000 url('../images/back6.jpg') no-repeat top center; 
}
#band div#Holder {
background: #000 url('../images/band.jpg') no-repeat 90% 45%; 
}
#feedback div#Holder {
background: #000 url('../images/feedback.jpg') no-repeat fixed 50% 0%; 
}
#gallery div#Holder {
background: #000 url('../images/venues.png') no-repeat top center;
}
#clients div#Holder {
background: #000 url('../images/back5.jpg') no-repeat 100% 0%; 
}
#venues div#Holder {
background: #000 url('../images/back13.jpg') no-repeat 50% 0;
}
#faqs div#Holder {
background: #000 url('../images/back12.jpg') no-repeat 200px 0;
}
#wedding div#Holder {
background: #000 url('../images/back11.jpg') no-repeat fixed 51% 0%; 
}
#brideguide div#Holder {
background: #000 url('../images/back11.jpg') no-repeat fixed 51% 0%; 
}
#event div#Holder {
background: #000 url('../images/back14.jpg') no-repeat 200% 10%; 
}
#setlist div#Holder {
background: #000 url('../images/back10.jpg') no-repeat 118% 4%;
}
#contact div#Holder {
background: #000 url('../images/trumpet.jpg') no-repeat 3px 194px;
}

/* /////////////////////////////////// L E F T  ////////////////////////////////*/

#Left {
float: left;
width: 310px;
padding: 0 0 0 0;
}
/*
#TopButtons {
width: 305px;
height: 30px;
padding: 0 0 0 43px;
}
*/

#TopButtons{
overflow: hidden;
width: 100%;
padding: 0 0 0 43px;
}


#TopButtons a.button {
background: transparent url('../images/bg_button_a.gif') no-repeat scroll top right;
color: #111;
display: block;
float: left;
font-size: 1.1em;
font-weight: bold;
width: auto; /* added to remove validator warning */
height: 31px;
margin-right: 2px;
padding-right: 11px;
text-decoration: none;
}

#TopButtons a.button span {
background: transparent url('../images/bg_button_span.gif') no-repeat;
display: block;
line-height: 11px;
padding: 10px 0 14px 11px;
}

#TopButtons a.button:active {
background-position: bottom right;
color: #FFF;
outline: none;
}

#TopButtons a.button:active span {
background-position: bottom left;
padding: 10px 0 10px 11px;
}

#Logo {
height: 65px;
width: 267px;
margin: 40px 0 0 37px;
background: url('../images/jazzbomb_logo.png') no-repeat top left; 
}

#Logo h1 a {
display:block;
height:65px;
text-indent:-5000px;
width: 267px;
}

#Nav {
float: left;
width: 95px;
margin: 143px 0 0 0;
padding: 0 25px 0 43px;
}

#SectionNav {
float: left;
width: 110px;
margin: 143px 0 0 0;
padding: 0 0 180px 28px;
border-left: 1px #444 dotted;
}

#SectionNavHome {
float: left;
width:430px;
margin: 128px 0 0 0;
padding: 0;
}

/* /////////////////////////////////// C O N T E N T  ////////////////////////////////*/

#container {
float: right;
position:relative; /* needed for footer positioning*/
width: 640px;
height: auto !important; /* real browsers */
min-height: 528px;
padding-bottom: 40px;
}

#Header {
float: right;
width: auto;
text-align: right;
height: 70px;
color: #FFF;
}

#Content {
width: 370px;
color: #1E1E1E;
padding: 257px 0 0 0;
}

#flashcontent {
width: 635px;
color: #1E1E1E;
padding: 0 0 0 0;
}

#flashAltText {
width: 370px;
color: #1E1E1E;
padding: 257px 0 0 0;
}

#gallery {
/* can specify stuff for flash gallery here */
}

#MusicPlayer {
/* can specify stuff for flash player here */
margin: 180px 0 0 0;
}

/* ///////////////////////////////// L I S T S + F O R M S /////////////////////////////////*/

ol {
margin-left: 0;
text-indent: 0em;
padding: 0 0 2em 2.2em;
}

ul {
list-style: none;
padding-bottom: 5px;
}

ol li {
font-size: 1.2em;
color: #999;
line-height: 1.4em;
}

ul li {
font-size: 1.2em;
color: #999;
line-height: 1.5em;
}

select {
width: 80px;
font-size: 1em;
letter-spacing: 0.3pt;
background-color: #111;
color: #FFF;
}

input { 
color:#111; 
font: bold 95% Arial, Helvetica, sans-serif;
margin-left: 5px;
padding: 1px;
} 






/* //////////////////////////////// T Y P O G R A P H I C ////////////////////////////// */

p {
color: #999;
font-size: 1.2em;
letter-spacing: 0.3pt;
word-spacing: 0pt;
line-height: 1.4;
text-align: left;
clear: both;
padding: 0 0 10px 0;
}

#Nav li, #SectionNav li {
font-size: 1.3em;
letter-spacing: 0.3pt;
word-spacing: 0pt;
line-height: 1.4;
color:#FFF;
background:none;
text-decoration:none;
}

h2 {
color: #FFF;
font-size: 1.4em;
font-style: normal;
font-weight: normal;
letter-spacing: 0.3pt;
line-height: 1.4em;
padding: 5px 0 1px 0px;
}

h3 {
color: #DDD;
font-size: 1.3em;
font-style: normal;
font-weight: bold;
letter-spacing: 0.3pt;
line-height: 1.4em;
padding: 5px 0 0 0;
}

h4 {
color: #FF5A00;
font-size: 1.2em;
font-style: normal;
font-weight: normal;
letter-spacing: 0.4pt;
line-height: 1.4em;
padding: 0 0 4px 0;
}


.low {
color: #444;
}

.red {
color: #FF5A00;
}

.line {
width: 370px;
border-top: 1px #444 dotted;
margin-top: 20px;
padding: 10px;
}


.small {
font-size: 1.1em;
padding: 4px 0 0 10px;
}


/* ////////////////////////////////// L I N K S ////////////////////////////////// */

#Nav a, #SectionNav a {
color:#BBB;
background:none;
text-decoration:none;
}

a {
color:#FF5A00;
background:none;
text-decoration:none;
}

#Nav a:hover, #SectionNav a:hover {
color:#FFF;
}

#Nav a:active, #SectionNav a:active  {
color:#FF5A00;
}

a:visited, #Nav a:visited {
color:#666;
background:none;
text-decoration:none;
}

a:visited:hover, #Nav a:visited:hover, #Footlinks a:hover {
color:#AAA;
}

#Content a:hover {
color:#FFF;
}

#facebook a {
width: 105px;
height: 54px;
display:block;
text-indent: 10000px;
overflow: hidden;
background: url("../images/facebook.gif") 0px 0px no-repeat;
}

#facebook a:hover {
background-position: 0px -54px;
}

#Footer a {
color: #444;
}

#Footer a:hover {
color: #AAA;
}

.small a {
color: #FFF;
}

/* ////////////////////////////////// F O O T E R ///////////////////////////////////////// */

#Footer {
width: auto;
height: 30px;
margin: 0 auto;
padding: 5px 0 0 0;
text-align: left;
background: #111;
clear: both;
}

#Footer #FootLinks {
float: right;
width: auto;
}
#Footer ul {
list-style-type: none;
clear: both;
}
#Footer ul li {
float: left;
width: auto;
margin-right: 3px;
padding-right: 3px;
}
#Footer ul li.last {
border: none;
}
#Footer #Copyright {
float: left;
width: auto;
text-align: left;
}
#Footer p, #Footer li {
color: #444;
font-size: 1.0em;
padding: 7px 0 0 0;
}