/* Maroon 5 Stylesheet */

/***************************************************************************//* WHITESPACE RESET */

* {
  padding:0;
  margin:0;
}
h1, h2, h3, h4, h5, h6, p, pre, blockquote, label, ul, ol, dl, fieldset, address { margin:0; }
li, dd { margin-left:1.5em;}
fieldset { padding: .5em; }

body {
background: #000;
padding:0;
margin:0;
font: 62.5% "Lucida Grande", Arial, Verdana, sans-serif;
}

p {
padding-bottom:1.5em;
}

h1 {
font:normal 22px/160% "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
text-transform:uppercase;
}

span.pagetitle {
font:normal 22px/160% "Lucida Grande", Helvetica, Arial, Verdana, sans-serif;
text-transform:uppercase;
}

a.blacklink:active,a.blacklink:link,a.blacklink:visited {
color:#000;
font:bold 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
text-decoration:none;
color:#0e0f0f;
text-transform:uppercase;
}

a.blacklink:hover {
text-decoration:underline;
}

a.toplink:active,a.toplink:link,a.toplink:visited {
color:#333;
text-decoration:none;
font-size:10px;
text-transform: capitalize;
font-weight:bold;
padding-left:5px;
}

a.toplink:hover {
text-decoration:underline;
}

a.creditlink:active,a.creditlink:link,a.creditlink:visited {
color:#000;
text-decoration:none;
font-size:10px;
text-transform: capitalize;
font-weight:bold;
padding-left:0px;
}

a.creditlink:hover {
color:#fff;
}

a.toplinkon:link,a.toplinkon:active,a.toplinkon:visited,a.toplinkon:hover {
color:#fff;
text-decoration:none;
font-size:10px;
text-transform: capitalize;
font-weight:bold;
padding-left:5px;
}

/***************************************************************************//* PAGE BACKGROUNDS */

#home,#news,#media,#photos,#disco,#bio,#links {
width:763px;
height:580px;
}

#home {background:transparent url(images/bghome.jpg) no-repeat 0 0;}
#news {background:transparent url(images/bgnews.jpg) no-repeat 0 0;}
#live {background:transparent url(images/bglive.jpg) no-repeat 0 0;}
#media {background:transparent url(images/bgmedia.jpg) no-repeat 0 0;}
#photos {background:transparent url(images/bgphotos.jpg) no-repeat 0 0;}
#disco {background:transparent url(images/bgdisco.jpg) no-repeat 0 0;}
#bio {background:transparent url(images/bgbio.jpg) no-repeat 0 0;}
#links {background:transparent url(images/bglinks.jpg) no-repeat 0 0;}

/***************************************************************************//* WRAPPER */

#wrap {
background:#282828;
border:3px solid #282828;
width:763px;
height:604px;
margin:50px auto 0 auto;
position:relative;
}

/***************************************************************************//* CONTENT */

#content {
width:763px;
height:580px;
}

/***************************************************************************//* MAIN NAVIGATION */

.togglenav {
background:transparent url(images/nav.png) no-repeat 0 0;
height:34px;
width:60px;
position:absolute;
top:29px;
}

#nav {
background:transparent url(images/nav.png) no-repeat 0 -34px;
height:34px;
width:763px;
position:absolute;
top:29px;
}

#nav li {
margin-left:0;
}

#buttons span {display:none;}

#buttons {
height:34px;
position:relative;
}

#buttons li {list-style:none; position:absolute;}
#buttons li, #buttons a {height:34px; display:block; top:0;}

#button1 {left:50px; width:60px;}
#button2 {left:110px; width:50px;}
#button3 {left:160px; width:55px;}
#button4 {left:215px; width:62px;}
#button5 {left:277px; width:60px;}
#button6 {left:337px; width:50px;}
#button7 {left:387px; width:50px;}
#button8 {left:437px; width:60px;}
#button9 {left:497px; width:80px;}
#button10 {left:577px; width:60px;}
#button11 {left:637px; width:75px;}

#button1 a:hover {background:transparent url(images/nav.png) -50px -68px no-repeat;}
#button2 a:hover {background:transparent url(images/nav.png) -110px -68px no-repeat;}
#button3 a:hover {background:transparent url(images/nav.png) -160px -68px no-repeat;}
#button4 a:hover {background:transparent url(images/nav.png) -215px -68px no-repeat;}
#button5 a:hover {background:transparent url(images/nav.png) -277px -68px no-repeat;}
#button6 a:hover {background:transparent url(images/nav.png) -337px -68px no-repeat;}
#button7 a:hover {background:transparent url(images/nav.png) -387px -68px no-repeat;}
#button8 a:hover {background:transparent url(images/nav.png) -437px -68px no-repeat;}
#button9 a:hover {background:transparent url(images/nav.png) -497px -68px no-repeat;}
#button10 a:hover {background:transparent url(images/nav.png) -577px -68px no-repeat;}
#button11 a:hover {background:transparent url(images/nav.png) -637px -68px no-repeat;}

#button1 a#on {background:transparent url(images/nav.png) -50px -68px no-repeat;}
#button2 a#on {background:transparent url(images/nav.png) -110px -68px no-repeat;}
#button3 a#on {background:transparent url(images/nav.png) -160px -68px no-repeat;}
#button4 a#on {background:transparent url(images/nav.png) -215px -68px no-repeat;}
#button5 a#on {background:transparent url(images/nav.png) -277px -68px no-repeat;}
#button6 a#on {background:transparent url(images/nav.png) -337px -68px no-repeat;}
#button7 a#on {background:transparent url(images/nav.png) -387px -68px no-repeat;}
#button8 a#on {background:transparent url(images/nav.png) -437px -68px no-repeat;}
#button9 a#on {background:transparent url(images/nav.png) -497px -68px no-repeat;}
#button10 a#on {background:transparent url(images/nav.png) -577px -68px no-repeat;}
#button11 a#on {background:transparent url(images/nav.png) -637px -68px no-repeat;}

/***************************************************************************//* PLAYLIST */

#playlist {
position:absolute;
width:180px;
height:35px;
background:#282828;
top:525px;
left:370px;
z-index:100;
padding:10px;
font-size:11px;
overflow: auto;
}

#playlist hr {
margin:5px 0 5px 0;
border:none;
width:99%;
color:#ccc;
background-color:#ccc;
height:1px;}

.playlisttext {

}

#playlist a.close:link,#playlist a.close:visited,#playlist a.close:active {
background:#fff;
color:#ff3300;
float:right;
padding:2px;
border:1px solid #fff;
text-decoration:none;
font-family:Arial;
font-weight:bold;
}

#playlist a.close:hover {
background:#000;
border:1px solid #000;
color:#fff;
}

#playlist a.song:link,#playlist a.song:visited,#playlist a.song:active {
color:#fff;
font-weight:bold;
font-size:11px;
text-decoration:none;
}

#playlist a.song:hover {
text-decoration:underline;
}

/***************************************************************************//* NEWS */

#newsbody {
width:440px;
height:440px;
margin:0 0 0 310px;
position:absolute;
top:125px;
font:normal 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
overflow:auto;
color:#353535;
}

h1#newspagetitle {
color:#2a292b;
padding-bottom:.5em;
position:absolute;
top:85px;
left:309px;
}

#newsbody h2 {
font:bold 12px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#2a292b;
}

/***************************************************************************//* LIVE */

#livebody {
width:240px;
height:440px;
margin:0 0 0 510px;
position:absolute;
top:125px;
font:normal 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
overflow:auto;
color:#353535;
}

h1#livepagetitle {
color:#2a292b;
padding-bottom:.5em;
position:absolute;
top:85px;
left:509px;
}

#livebody h2 {
font:bold 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#2a292b;
text-transform:uppercase;
}

a.tickets:link,a.tickets:visited,a.tickets:active {
color:#ff3300;
text-decoration:none;
text-transform:uppercase;
font-weight:bold;
}

a.tickets:hover {
text-decoration:underline;
}

a.newsentry:link,a.tickets:visited,a.tickets:active {
color:#ff3300;
text-decoration:none;
text-transform:uppercase;
font-weight:bold;
}

a.newsentry:hover {
text-decoration:underline;
}

#frames {
position:absolute;
top:165px;
left:0;
}

#frame1 {
position:absolute;
left:50px;
}

#frame2 {
position:absolute;
top:500px;
left:0;
}

/***************************************************************************//* MEDIA */

#mediabody {
width:230px;
height:440px;
margin:0 0 0 530px;
position:absolute;
top:125px;
font:normal 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
overflow:auto;
color:#353535;
}

h1#mediapagetitle {
color:#000;
padding-bottom:.5em;
position:absolute;
top:85px;
left:529px;
}

#mediabody h1 {
color:#000;
padding-bottom:.5em;
}

#mediabody h2, #videowrap h2 {
font:bold 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#0e0f0f;
text-transform:uppercase;
text-align:center;
}

.mediaitem {
padding-bottom:-2px;
}

.mediaitem a:link img,.mediaitem a:visited img,.mediaitem a:active img {
background:transparent;
padding:2px;
}

.mediaitem a:hover img {
border:2px solid #ff3300;
padding:0;
}

img.mediathumb {
float:left;
border:0;
background:#333;
width:67px;
height:50px;
margin-right:8px;
}

#videowrap {
position:absolute;
top:105px;
left:105px;
}

#video {
background:transparent;
width:320px;
height:240px;
display:block;
margin-top:5px;
}

.mediameta {
padding-top:10px;
}

.mediameta2 {
padding-top:0px;
}

.videotitle {
font-family:Lucida Grande;
font-size:10px;
font-weight:bold;
color:#000;
line-height:120%;
}

/***************************************************************************//* PHOTOS */

#photobody {
width:225px;
height:440px;
margin:0 0 0 535px;
position:absolute;
top:125px;
font:normal 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
overflow:auto;
color:#353535;
}

#photospagetitle {
position:absolute;
top:85px;
left:535px;
}

#photospagetitle h1 {
color:#181817;
padding-bottom:.5em;
}

#photobody h2 {
font:bold 10px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#0e0f0f;
text-transform:uppercase;
margin-bottom:.5em;
}

.thumbnail {
width:49px;
height:49px;
float:left;
margin:0 15px 5px 0;
border:2px solid transparent;
}

#full {
position:absolute;
top:135px;
left:4px;
width:520px;
height:350px;
overflow:hidden;
}

a.thumbnail:visited,a.thumbnail:link,a.thumbnail:active {
border:0;
padding:2px;
}

a.thumbnail:hover {
border:2px solid #ff3300;
padding:0;
}

.photogroup {
padding:1em 0 1em 0;
}

/***************************************************************************//* DISCO */

#discobody {
width:240px;
height:480px;
margin:0 0 0 570px;
position:absolute;
top:85px;
font:normal 11px/130% "Lucida Grande", Arial, Verdana, sans-serif;
overflow:auto;
color:#111;
}	

#discobody h1 {
color:#181817;
padding-bottom:.2em;
}

#discobody h2 {
font:bold 13px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#0e0f0f;
text-transform:uppercase;
}

#discobody h3 {
font:bold 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#0e0f0f;
text-transform:uppercase;
}

#cover {
position:absolute;
top:145px;
left:280px;
}

#coverthumbs {
width:475px;
height:92px;
position: absolute;
top:480px;
left:280px;
overflow:auto;
}

a.coverlink:link img,a.coverlink:visited img, a.coverlink:active img {
border:0;
padding:2px;
margin:0 1em 1em 0;
}


a.coverlink:hover img {
border:2px solid #ff3300;
padding:0;
}

a.coverlinkon img {
border:2px solid #fff;
margin:0 1em 1em 0;
padding:0;
}

span.buy {
color:#fff;
text-transform:uppercase;
font-weight:bold;
}

a.buylink:link,a.buylink:visited,a.buylink:active {
color:#fff;
text-decoration:none;
padding:0 5px 0 5px;
text-transform:uppercase;
font-weight:bold;
}

a.buylink:hover {
text-decoration:underline;
}

/***************************************************************************//* BIO */

#biobody {
width:330px;
height:450px;
margin:0 0 0 30px;
position:absolute;
top:115px;
font:normal 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
overflow:auto;
color:#353535;
}

#biopagetitle {
position:absolute;
top:85px;
left:29px;
}

#biopagetitle span.pagetitle {
color:#181817;
padding-bottom:.1em;
}

#biobody h2 {
font:bold 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#0e0f0f;
text-transform:uppercase;
}

#biobody strong.black {
color:#000;
}

#bioportraits {
position:absolute;
top:150px;
left:530px;
width:180px;
height:253px;
}

a.next:link, a.next:visited, a.next:active {
background:transparent url(images/next.png) no-repeat 0 0;
display:block;
padding:10px;
float:right;
text-decoration:none;
text-transform:uppercase;
color:#000;
font-weight:bold;
}

a.next:hover {
text-decoration:underline;
}

a.previous:link, a.previous:visited, a.previous:active {
background:transparent url(images/previous.png) no-repeat 0 0;
display:block;
padding:10px;
float:left;
text-decoration:none;
text-transform:uppercase;
color:#000;
font-weight:bold;
margin-left:15px;
}

a.previous:hover {
text-decoration:underline;
}

/***************************************************************************//* LINKS */

#linksbody {
width:240px;
height:480px;
margin:0 0 0 65px;
position:absolute;
top:85px;
font:bold 11px/125% "Lucida Grande", Arial, Verdana, sans-serif;
color:#fff;
}

#linksbody h1 {
color:#181817;
padding-bottom:.5em;
}

#linksbody h2 {
font:bold 11px/160% "Lucida Grande", Arial, Verdana, sans-serif;
color:#0e0f0f;
text-transform:uppercase;
}

#linksbody a {
color:#fff;
text-decoration:none;
}

#linksbody a:hover {
text-decoration:underline;
}

#col1 {
width:250px;
position:absolute;
top:40px;
}

#col2 {
width:250px;
position:absolute;
top:40px;
left:210px;
}

#col3 {
width:250px;
position:absolute;
top:40px;
left:450px;
}

/***************************************************************************//* MAILING LIST */

#mailinglist {
margin:6px auto;
width:180px;
color:#fff;
}

#mailinglist input.email, #mailinglist input.zip, #mailinglist input.phone {
background:#999;
border:0;
color:#000;
font-size:10px;
font-family:Arial, Verdana, sans-serif;
height:14px;
padding:2px 0 0 4px;
}

#mailinglist input.email {
width:200px;
}

#mailinglist input.zip {
width:100px;
}

#mailinglist input.phone {
width:100px;
}

/***************************************************************************//* FOOTER */

#footer {
color:#a9a9a9;
font-size:10px;
font-family:Arial;
text-transform:uppercase;
}

#footerwrap {
margin:10px 0 0 12px;
}

#footer input.email, #footer input.zip, #footer input.phone {
background:#000;
border:0;
color:#666;
font-size:10px;
font-family:Arial, Verdana, sans-serif;
height:14px;
padding:4px 0 0 4px;
}

#footer input.email {
width:120px;
}

#footer input.zip {
width:60px;
}

#footer input.phone {
width:60px;
}

.listlink {
padding:0 1em 0 1em;
}

span.streetteams {
padding:0 1em 0 1em;
}

a.footerlink:link,a.footerlink:visited,a.footerlink:active {
color:#a9a9a9;
text-decoration:none;
}

a.footerlink:hover {
text-decoration:underline;
}

input.submit {
padding:0 5px 0 5px;
}

.audiolink {
padding-left:1em;
}

/***************************************************************************//* FLOAT PATCH */
.floatcontainer:after { 
content: ".";
display: block;
height: 0;
clear: both;
visibility:hidden;
}

/* Mark Hadley's fix for IE Mac */  
.floatcontainer { display: inline-table;}

/* Hides from IE Mac \*/ 
* html .floatcontainer {height: 1%;} 
.floatcontainer{display:block;}
/* End Patch */

