/* CSS Document */ body{padding: 0px; margin: 0px; background-image: url(../images/bg.jpg); background-position: top center; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px;} #holder {height:auto; width: 867px; background-color:#transparent; margin: auto; margin-bottom: 40px;} #header {height: 251px; width: 867px; background-image:url(../images/header.jpg); margin: 0px 0px 12px 0px;} #smallLinks {height: 40px; width: 395px; background-color:#transparent; margin: 0px 0px 0px 489px;} #smallLinks a.youtube {height: 40px; width: 57px; background-image: url(../images/youtubeOff.jpg); display: block; float:left;} #smallLinks a:hover.youtube {background-image: url(../images/youtubeOn.jpg);} #smallLinks a.myspace {height: 40px; width: 98px; background-image: url(../images/myspaceOff.jpg); display: block;float: left;} #smallLinks a:hover.myspace {background-image: url(../images/myspaceOn.jpg);} #smallLinks a.twitter {height:40px; width: 98px; background-image: url(../images/twitter.jpg); display:block; float: left; overflow:hidden;} #smallLinks a:hover.twitter {background-position: 0px -40px;} #smallLinks a.facebook {height:40px; width: 84px; background-image: url(../images/facebook.jpg); display:block; float: left; overflow:hidden;} #smallLinks a:hover.facebook {background-position: 0px -40px;} #smallLinks a.rss {height:40px; width: 40px; background-image: url(../images/rss.jpg); display:block; float: left; overflow:hidden;} #smallLinks a:hover.rss {background-position: 0px -40px;} #navigation {height: 20px; width: 663px; background-color: #transparent; display: block; margin: 0px 0px 0px 140px;} #navigation ul {list-style: none; padding: 0px; margin: 0px;} #navigation ul li {float: left;} #navigation a.home {width: 86px; height:20px; background-image: url(../images/homeOff.jpg); display: block;} #navigation a.albums {width: 98px; height:20px; background-image: url(../images/albumsOff.jpg); display: block;} #navigation a.singles {width: 98px; height:20px; background-image: url(../images/singlesOff.jpg); display: block;} #navigation a.artists {width: 92px; height:20px; background-image: url(../images/artistsOff.jpg); display: block;} #navigation a.downloads {width: 126px; height:20px; background-image: url(../images/downloadsOff.jpg); display: block;} #navigation a.store {width: 82px; height:20px; background-image: url(../images/storeOff.jpg); display: block;} #navigation a.media {width: 81px; height:20px; background-image: url(../images/mediaOff.jpg); display: block;} #navigation a:hover.home {width: 86px; height:20px; background-image: url(../images/homeOn.jpg); display: block;} #navigation a:hover.albums {width: 98px; height:20px; background-image: url(../images/albumsOn.jpg); display: block;} #navigation a:hover.singles {width: 98px; height:20px; background-image: url(../images/singlesOn.jpg); display: block;} #navigation a:hover.artists {width: 92px; height:20px; background-image: url(../images/artistsOn.jpg); display: block;} #navigation a:hover.downloads {width: 126px; height:20px; background-image: url(../images/downloadsOn.jpg); display: block;} #navigation a:hover.store {width: 82px; height:20px; background-image: url(../images/storeOn.jpg); display: block;} #navigation a:hover.media {width: 81px; height:20px; background-image: url(../images/mediaOn.jpg); display: block;} #banners { width: 855px; height: auto; min-height: 100px; background-image: url('../images/banner_bg.jpg'); background-repeat: repeat; padding: 6px; margin-bottom: 10px; } #featured_albums { width: 855px; height: 96px; background-image: url('../images/banner_bg.jpg'); background-repeat: repeat; padding: 6px; margin-bottom: 10px; overflow: hidden; } .buy { height: 30px; width: 78px; overflow: hidden; display: block; background-image: url('../images/btn_buy.jpg'); } .listen { height: 30px; width: 78px; overflow: hidden; display: block; background-image: url('../images/btn_listen.jpg'); } .coming_soon { height: 30px; width: 156px; overflow: hidden; display: block; background-image: url('../images/btn_soon.jpg'); } .buy:hover, .listen:hover { background-position: 0px -30px; } /******************/ /* CSS Document */ #leftHolder {height: 1077px; width: 326px; background-color:#transparent; margin: 0px; float:left;} #rightHolder {height: 1077px; width: 528px; background-color:#transparent; margin: 0px; float: left;} #topSpacer{height: 1077px; width:13px; background-color:#transparent; background-image: url(../images/spacer.jpg); display:block; float:left;} #news {height: 445px; width: 326px; background-color: #ffffff; margin: 0px;} #newsContent {height:393px; width: 312px; background-color:#ffffff; margin: 0px 7px 7px 7px;} #newsBottom {height: 45px; width: 326px; display:block; background-image: url(../images/newsBottom.jpg); background-repeat:no-repeat;} a.plus {height: 28px; width: 30px; background-image: url(../images/plusOff.jpg);display: block; float: left; margin: 0px 7px 0px 7px;} a:hover.plus {background-image: url(../images/plusOn.jpg);} a.minus {height: 28px; width: 30px; background-image: url(../images/minusOff.jpg);display: block; float: left; margin: 0px;} a:hover.minus {background-image: url(../images/minusOn.jpg);} a.archive {height: 28px; width: 77px; background-image: url(../images/archiveOff.jpg);display: block; float: right; margin: 0px 7px 0px 0px;} a:hover.archive {background-image: url(../images/archiveOn.jpg);} #free {height: 150px; width: 326px; background-color:#ffffff; margin: 0px;} #freeContent {height:98px; width: 312px; background-color:#ffffff; margin: 0px 7px 7px 7px;} #freeBottom {height: 17px; width: 326px; display:block; background-image: url(../images/freeBottom.jpg);} #podcast {height: 318px; width: 326px; background-color:#ffffff; margin: 0px;} #podContent {height:269px; width: 312px; background-color:#ffffff; margin: 0px 7px 5px 7px; overflow: hidden;} #podBottom {height: 12px; width: 326px; display:block; background-image: url(../images/podBottom.jpg);} a.podCast {height: 22px; width: 304px; background-image: url(../images/podOff.jpg); display: block; margin: 0px 0px 4px 0px; text-decoration: none; font-weight: bold; color: #000000; padding: 8px 0px 0px 8px;} a:hover.podCast{background-image: url(../images/podOn.jpg);} #mailing {height: 92px; width: 326px; background-color:#ffffff; margin: 0px;} #mailingContent {height:40px; width: 312px; background-color:#ffffff; margin: 0px 7px 7px 7px;} .newsLetter {height: 35px; width: 313px; background-image: url(../images/newsletterOff.jpg); display: block;} .newsLetter:hover {background-image: url(../images/newsletterOn.jpg); cursor: pointer;} #featured {height: 445px; width: 528px; background-color: #ffffff; margin: 0px 0px 0px 0px;} #featuredContent {height:393px; width: 514px; background-color:#ffffff; margin: 0px 7px 7px 7px;} #featuredBottom {height: 45px; width: 528px; display:block; background-image: url(../images/featuredBottom.jpg); background-repeat:no-repeat;} a.featured {height: 28px; width: 77px; background-image: url(../images/viewAllOff.jpg);display: block; float: right; margin: 0px 7px 0px 0px;} a:hover.featured {background-image: url(../images/viewAllOn.jpg);} #beatport {height: 365px; width: 528px; background-image: url(../images/beatportBg.jpg); margin: 0px 0px 16px 0px;} #beatportContent {height:315px; width: 442px; background-color: #FF6600; margin: 0px 43px 15px 43px;} #merch {height: 207px; width: 528px; background-color:#ffffff; margin: 0px 0px 0px 0px;} #merchContent {height:155px; width: 514px; background-color:#ffffff; margin: 0px 7px 7px 7px; overflow: hidden;} #merchItem {width: 121px; float:left; margin: 0px 10px 0px 0px; text-align: center;} #merchItem img {border: 3px solid #999; margin: 0px 0px 3px 0px; height: 116px; width: 115px;} a.buyNow{height: 35px; width:115px; background-image: url(../images/buyNowOff.jpg); display: block; margin: 0px 0px 0px 4px;} a:hover.buyNow {background-image: url(../images/buyNowOn.jpg);} #merch_item {width: 209px; height: auto; text-align: center; margin-right: 3px; background-color: #ffffff; display: block; float: left;} #merch_item a.buyNow{margin: 10px 0px 10px 47px;} #footer {height: 25px; width: 867px; clear: both; text-align: center;} #footer a {text-decoration: none; font-weight: bold; color: #000000;} #footer a:hover {color:#FF6600;} .synapse {height: 25px; width: 25px; background-image: url(../images/madeBySynapseOff.jpg); display: block; margin: auto;} .synapse:hover {background-image: url(../images/madeBySynapseOn.jpg);} a.page { font-weight: bold; font-size: 12px; color: #ffffff; text-decoration: none; height: 10px; width: 10px; padding: 5px 5px 3px 5px; margin-left: 5px; } .page_selected { height: 10px; width: 10px; padding: 5px 5px 3px 5px; color: #000000; margin-left: 5px; } a.page:hover { color: #000000; } .buy { height: 30px; width: 78px; overflow: hidden; display: block; background-image: url('../images/btn_buy.jpg'); } .listen { height: 30px; width: 78px; overflow: hidden; display: block; background-image: url('../images/btn_listen.jpg'); } .buy:hover, .listen:hover { background-position: 0px -30px; } .coming_soon { height: 30px; width: 156px; overflow: hidden; display: block; background-image: url('../images/btn_soon.jpg'); } /****************/ #main {height: auto; width: 326px; background-color:#transparent; margin: 0px; float:left;} #albums {height: auto; width: 867px; background-color: #ffffff; margin: 0px;} #albumsContent {height:auto; width: 853px; background-color:#ffffff; margin: 0px 7px 7px 7px;} #albumsBottom { width: 600px;} a.artistName {height: 28px; width: 96px; display: block; float: left; margin: 7px 7px 0px 7px; color: #FFFFFF; font-weight: bold; text-transform: capitalize; text-decoration: none; font-size: 12px;} a:hover.artistName {color: #000000;} a.albumName {height: 28px; width: 96px; display: block; float: left; margin: 7px 7px 0px 7px; color: #FFFFFF; font-weight: bold; text-transform: capitalize; text-decoration: none; font-size: 12px;} a:hover.albumName {color: #000000;} a.sortBy {height: 30px; width: 77px; background-image: url(../images/sortBy.jpg);display: block; float: left; margin: 0px 7px 0px 7px;} .slash {height: 28px; width: 6px; display: block; float: left; margin: 5px 7px 0px 7px; color: #FFFFFF; font-weight: bold; text-transform: capitalize; text-decoration: none; font-size: 12px;} #albumBgDark {height: 96px; width: 281px; background-image: url(../images/albumBgDark.jpg); margin: 0px 5px 0px 0px;} #albumBgDark2 {height: 96px; width: 281px; background-image: url(../images/albumBgDark.jpg); margin:0xp;} #albumBgLight {height: 96px; width: 281px; background-image: url(../images/albumBgLight.jpg); margin: 0px 5px 0px 0px;} #albumBgLight2 {height: 96px; width: 281px; background-image: url(../images/albumBgLight.jpg); margin:0xp;} #albumArt {height:95px; width: 95px; background-color: #transparent; float: left; margin: 0px 8px 0px 0px;} #albumArt img {height: 82px; width: 82px; margin: 4px 0px 0px 4px; border: solid; border-width: 3px; border-color: #ffffff;} #right {width: 152px; background-color: #transparent; float: left; margin: 2px 0px 0px 0px;} #name {background-color: #transparent; height: 55px; width: 152px;} #links {background-color:#transparent; height: 32px; width: 152px;} a.beatport {height: 23px; width: 140px; background-image: url(../images/viewMoreOff.jpg); display: block; margin: 6px 0px 0px 0px;} a:hover.beatport {background-image: url(../images/viewMoreOn.jpg);} a.iTunes {height: 13px; width: 76px; background-image: url(../images/buyiTunesOff.jpg); display: block;} a:hover.iTunes {background-image: url(../images/buyiTunesOn.jpg);} a.system {height: 13px; width: 76px; background-image: url(../images/buySystemOff.jpg); display: block;} a:hover.system {background-image: url(../images/buySystemOn.jpg);} a.amazon {height: 13px; width: 76px; background-image: url(../images/buyAmazonOff.jpg); display: block;} a:hover.amazon {background-image: url(../images/buyAmazonOn.jpg);} a.page { font-size: 16px; font-weight: bold; text-decoration: none; color: #000000; margin: 0px 2px 0px 2px; } .page_selected { font-size: 16px; font-weight: bold; text-decoration: none; color: #ffffff; margin: 0px 2px 0px 2px; } a.page:hover { color: #ffffff; } #footer {height: 25px; width: 867px; background-repeat: no-repeat; clear: both; text-align: center;} #footer a {text-decoration: none; font-weight: bold; color: #000000;} #footer a:hover {color:#FF6600;} a {color: #FF6600;} a:hover {color: #FF9900;} #bioHolder a {color: #FF6600;} #bioHolder a:hover {color: #FF9900;} #clear {height: 30px; width: 800px; display: block; clear: both;} /*******************************/ ****** slide show *****/ body { color: #ccc; margin: 0 auto; padding: 0; font-size: 0.6em; } h1 { color: #fff; font-size: 47px; font-weight: bolder; margin: 0 40px; padding: 0.08em 0; } h1 sup { color: #ddd; } h1 a { color: #fff; text-decoration: none; } h1 .company, h1 a .company { color: #d01a71; } h2 { color: #ddd; font-size: 2.5em; } h3 { color: #fff; font-size: 18px; } h4 { font-size: 1.3em; } .content { margin: 0 20px; } .content p.linkage { margin-top: 2em; text-align: right; font-size: 1.7em; color: #ddd; } .content p.linkage a { color: #fff; } /*.content p.linkage a { color: #fff; background: url('../images/bg/biglink_off.gif') center right no-repeat; padding: 10px 20px; text-decoration: none; } .content p.linkage a:hover { background: url('../images/bg/biglink_on.gif') center right no-repeat; font-style: italic; }*/ #myGallery { text-align: left; margin: 0 auto; } /*******************************/ #myGallery, #myGallerySet, #flickrGallery { width: 416px; height: 302px; z-index:5; } .jdGallery a { outline:0; } #flickrGallery { width: 500px; height: 334px; } #myGallery img.thumbnail, #myGallerySet img.thumbnail { display: none; } .jdGallery { overflow: hidden; position: relative; } .jdGallery img { border: 0; margin: 0; } .jdGallery .slideElement { width: 100%; height: 100%; background-color: #FFFFFF; background-repeat: no-repeat; background-position: center center; background-image: url('img/loading-bar-black.gif'); } .jdGallery .loadingElement { width: 100%; height: 100%; position: absolute; left: 0; top: 0; background-color: #FFFFFF; background-repeat: no-repeat; background-position: center center; background-image: url('img/loading-bar-black.gif'); } .jdGallery .slideInfoZone { position: absolute; z-index: 10; width: 100%; margin: 0px; left: 0; bottom: 0; height: 20px; background: #633921; color: #fff; text-indent: 0; overflow: hidden; color: #fff; font-size: 16px; font-weight: normal; padding-top: 10px; text-align: center; font-family: Georgia, "Times New Roman", Times, serif; text-transform: uppercase; } * html .jdGallery .slideInfoZone { bottom: -1px; } .jdGallery .slideInfoZone h2 { padding: 0; font-size: 80%; margin: 0; margin: 2px 5px; color: inherit; } .jdGallery .slideInfoZone p { padding: 0; font-size: 18px; margin: 2px 5px; color: #fff; } .jdGallery div.carouselContainer { position: absolute; height: 135px; width: 100%; z-index: 10; margin: 0px; left: 0; top: 0; display: none; } .jdGallery a.carouselBtn { position: absolute; bottom: 0; right: 30px; height: 20px; /*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/ text-align: center; padding: 0 10px; font-size: 13px; background: #333; color: #fff; cursor: pointer; } .jdGallery .carousel { position: absolute; width: 100%; margin: 0px; left: 0; top: 0; height: 115px; background: #333; color: #fff; text-indent: 0; overflow: hidden; } .jdExtCarousel { overflow: hidden; position: relative; } .jdGallery .carousel .carouselWrapper, .jdExtCarousel .carouselWrapper { position: absolute; width: 100%; height: 78px; top: 10px; left: 0; overflow: hidden; } .jdGallery .carousel .carouselInner, .jdExtCarousel .carouselInner { position: relative; } .jdGallery .carousel .carouselInner .thumbnail, .jdExtCarousel .carouselInner .thumbnail { cursor: pointer; background: #FFFFFF; background-position: center center; float: left; border: solid 1px #fff; } .jdGallery .wall .thumbnail, .jdExtCarousel .wall .thumbnail { margin-bottom: 10px; } .jdGallery .carousel .label, .jdExtCarousel .label { font-size: 13px; position: absolute; bottom: 5px; left: 10px; padding: 0; margin: 0; } .jdGallery .carousel .wallButton, .jdExtCarousel .wallButton { font-size: 10px; position: absolute; bottom: 5px; right: 10px; padding: 1px 2px; margin: 0; background: #222; border: 1px solid #888; cursor: pointer; } .jdGallery a.right, .jdGallery a.left { position: absolute; height: 99%; width: 25%; cursor: pointer; z-index:10; filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } * html .jdGallery a.right, * html .jdGallery a.left { filter:alpha(opacity=80); } .jdGallery a.right:hover, .jdGallery a.left:hover { filter:alpha(opacity=80); -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } .jdGallery a.left { left: 0; top: 0; background: url('img/fleche1.png') no-repeat center left; } * html .jdGallery a.left { background: url('img/fleche1.gif') no-repeat center left; } .jdGallery a.right { right: 0; top: 0; background: url('img/fleche2.png') no-repeat center right; } * html .jdGallery a.right { background: url('img/fleche2.gif') no-repeat center right; } .jdGallery a.open { left: 0; top: 0; width: 100%; height: 100%; } .withArrows a.open { position: absolute; top: 0; left: 25%; height: 99%; width: 50%; cursor: pointer; z-index: 10; background: none; -moz-opacity:0.8; -khtml-opacity: 0.8; opacity: 0.8; } .withArrows a.open:hover { background: url('img/open.png') no-repeat center center; } * html .withArrows a.open:hover { background: url('img/open.gif') no-repeat center center; filter:alpha(opacity=80); } /* Gallery Sets */ .jdGallery a.gallerySelectorBtn { z-index: 15; position: absolute; top: 0; left: 30px; height: 20px; /*width: 100px; background: url('img/carousel_btn.gif') no-repeat;*/ text-align: center; padding: 0 10px; font-size: 13px; background: #333; color: #fff; cursor: pointer; opacity: .4; -moz-opacity: .4; -khtml-opacity: 0.4; filter:alpha(opacity=40); } .jdGallery .gallerySelector { z-index: 20; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: #FFFFFF; } .jdGallery .gallerySelector h2 { margin: 0; padding: 10px 20px 10px 20px; font-size: 20px; line-height: 30px; color: #fff; } .jdGallery .gallerySelector .gallerySelectorWrapper { overflow: hidden; } .jdGallery .gallerySelector .gallerySelectorInner div.galleryButton { margin-left: 10px; margin-top: 10px; border: 1px solid #888; padding: 5px; height: 40px; color: #fff; cursor: pointer; float: left; } .jdGallery .gallerySelector .gallerySelectorInner div.hover { background: #333; } .jdGallery .gallerySelector .gallerySelectorInner div.galleryButton div.preview { background: #FFFFFF; background-position: center center; float: left; border: none; width: 40px; height: 40px; margin-right: 5px; } .jdGallery .gallerySelector .gallerySelectorInner div.galleryButton h3 { margin: 0; padding: 0; font-size: 18px; font-weight: normal; } .jdGallery .gallerySelector .gallerySelectorInner div.galleryButton p.info { margin: 0; padding: 0; font-size: 12px; font-weight: normal; color: #aaa; }