/* reset / setup */
* { padding:0; margin:0; }
h1 { font-size:36px; }
h2 { font-size:25px; }
h3 { font-size:20px; }
h4, h5 { font-size:18px; }
h1, h1, h3, h4, h5 { padding:0; line-height:1.1em; }
p { padding: 0 0 1em; }
ul, ol { padding: 0 0 1em 2em; }
img { border:none; }
a { color:#000; }
a:hover { color:#fff; }
body { color:#fff; font:15px/24px Arial, Helvetica, sans-serif; background:#fff; }
:focus	{ outline:0; }

.left { float:left; }
.right { float:right; }
.clear { clear:both; }
 
ul.toc { list-style-type:none; padding:0; margin:0; }
ul.toc li { float:left; margin:0; padding:0; }

/* slide setup */
.window { width:100%; height:auto; overflow:hidden; }
.container { width:1062px; overflow:visible; margin:0 auto; }
.content { background:url(art/bg.jpg) #fff repeat-x top; width:20000px; position:relative; }
.page { float:left; width: 1062px; padding:115px 0 0; z-index:2; position:relative; margin:0 0 0 1062px; }
.page + .page { margin:0 0 0 2000px; }
.page-content { position:relative; top:300px; overflow:hidden; height:0px; }
.stripe { width:20000px; background:#000; height:450px; position:absolute; left:0; top: 290px; z-index:1; }

/* header */
.header { width:1062px; position:absolute; top:5px; z-index:5; height:130px; }
.header .links { float:right; padding:20px 0 5px; margin:0 24px 0 0; }
.header .logo { float:left; }

#home-header, #sec-header { position:absolute; width:1062px; }
#home-header .logo img { margin:10px 0 0 25px; width:119px; height:50px; }
#sec-header .logo img { width:183px; height:80px; }

/* header toc */
.header-toc { background:url(art/toc-bg.png) no-repeat; width:1016px; height:34px; padding:15px 0 0; margin:72px 0 0 24px; clear:right; }
.header-toc ul { list-style:none; height:19px; margin:0 0 0 30px; padding:0; clear:both; }
.header-toc ul li { float:left; margin:0 18px; text-align:center; height:13px; z-index:10; position:relative; overflow:hidden; }
.header-toc ul li a { display:block; height:13px; padding:100px 0 0; background:url(art/toc.png) no-repeat; }

.header-toc ul li.home a { width:120px; }
.header-toc ul li.real-look a { width:107px; background-position:-162px 0; }
.header-toc ul li.real-feel a { width:99px; background-position:-309px 0; }
.header-toc ul li.real-sound a { width:123px; background-position:-448px 0; }
.header-toc ul li.videos a { width:72px; background-position:-609px 0; }
.header-toc ul li.faqs a { width:49px; background-position:-721px 0; }
.header-toc ul li.sound-shop a { width:129px; background-position:-810px 0; }

.header-toc ul li.home a:hover { background-position:0 -13px; }
.header-toc ul li.real-look a:hover { background-position:-162px -13px; }
.header-toc ul li.real-feel a:hover { background-position:-309px -13px; }
.header-toc ul li.real-sound a:hover { background-position:-448px -13px; }
.header-toc ul li.videos a:hover { background-position:-609px -13px; }
.header-toc ul li.faqs a:hover { background-position:-721px -13px; }
.header-toc ul li.sound-shop a:hover { background-position:-810px -13px; }

.header-toc ul li.home.selected a { background-position:0 -26px; }
.header-toc ul li.real-look.selected a { background-position:-162px -26px; }
.header-toc ul li.real-feel.selected a { background-position:-309px -26px; }
.header-toc ul li.real-sound.selected a { background-position:-448px -26px; }
.header-toc ul li.videos.selected a { background-position:-609px -26px; }
.header-toc ul li.faqs.selected a { background-position:-721px -26px; }
.header-toc ul li.sound-shop.selected a { background-position:-810px -26px; }

#selected-toc { background:url(art/toc-slider.png) no-repeat; height:42px; position:absolute; z-index:2; top:72px; }
#selected-toc .right { background:url(art/toc-slider.png) no-repeat right; width:18px; height:42px; float:right; }

/* footer */
.footer { color:#000; margin:0 0 50px; text-align:center; font-size:12px; line-height:12px; }
.footer a:hover { color:#444; }
.footer .toc { margin:0 auto; width:420px; padding:0; position:relative; }
.footer .toc li { height:15px; }
.footer .toc li + li { border-left:1px solid; padding:0 0 0 5px; margin:0 0 0 5px; }
.footer .copyright { display:block; clear: both; padding:10px 0 0; line-height:18px; }

/* home page */
#home { padding:0 0 115px; }
#home .page-inner-content { background: url(art/home-bg.png) no-repeat right top; top:0; }
#home .intro-par { padding:256px 0 0; width:320px; }
#home .intro-par img { display:block; margin:10px auto; }
#home img.page-title { margin:479px 0 0 28px; }

#home .promo-area { width:1006px; clear:both; padding:30px 0 0; height:244px; float:left; }
#home .promo-area p { background:url(art/front-promo.png) no-repeat; padding:55px 0 0 23px; float:left; height:189px; color:#000; font-size:14px; line-height:17px; cursor:pointer; }
#home .promo-area p.over { color:#fff; }
#home .promo-area p + p { margin:0 0 0 6px; }
#home .promo-area p.real-look { padding-right:160px; width:148px; }
#home .promo-area p.real-feel { background-position:-331px 0; padding-right:155px; width:153px; }
#home .promo-area p.real-sound { background-position:-662px 0; padding-right:180px; width:128px; }

#home .promo-area p.real-look.over { background-position:-993px 0; }
#home .promo-area p.real-feel.over { background-position:-1324px 0; }
#home .promo-area p.real-sound.over { background-position:-1655px 0; }


#home .shadow.header, #home .shadow.footer { display:none; }
#home .shadow.body { background:none; }

/* secondary pages */
.page-inner-content { z-index:3; position:relative; top:-16px; }
.intro-par { padding:140px 0 0 58px; width:280px; }
.next { float:right; padding:8px 0 0; }

/* shadows */
.shadow { background:url(art/shadow.png) repeat-y; padding:0 28px; width:1006px; clear:both; z-index:1; }
.shadow.header { background-position: -1062px 0; height:16px; padding-top:28px; }
.shadow.body { background-position: -2124px 0; top:49px; position:relative; }
.shadow.footer { height:16px; padding-bottom:28px; position:relative; top:49px; }

/* titles */
img.page-title { position:absolute; margin:364px 0 0 28px; z-index:10; }

/* real look */
.real-look .page-inner-content { background:url(art/look-bg.jpg) no-repeat #fff; }
.real-look .promo-area { padding:188px 0 0 58px; color:#444; font:12px/17px Arial, Helvetica, sans-serif; }
.real-look .promo-area p { background-repeat:no-repeat; padding:191px 0 0; float:left; width:267px; }
.real-look .promo-area p + p { margin:0 0 0 44px; }
.real-look .promo-area .sizes { background-image: url(art/promo-sizes.png); }
.real-look .promo-area .hardware { background-image: url(art/promo-hardware.png); }
.real-look .promo-area .shells { background-image: url(art/promo-shells.png); }

/* real feel */
.real-feel .page-inner-content { background:url(art/feel-bg.jpg) no-repeat #fff; color:#fff; }
.real-feel .promo-area { padding:118px 0 0 58px; color:#444; font:12px/17px Arial, Helvetica, sans-serif; }
.real-feel .promo-area p { background-repeat:no-repeat; padding:151px 0 0; float:left; width:197px; }
.real-feel .promo-area p + p { margin:0 0 0 24px; }
.real-feel .promo-area .shift { background-image:url(art/promo-shift.png); padding:20px 0 0; }
.real-feel .promo-area .cymbals { background-image:url(art/promo-cymbals.png); }
.real-feel .promo-area .epc2 { background-image:url(art/promo-epc2.png); }
.real-feel .promo-area .trutrac { background-image:url(art/promo-trutrac.png); }
.real-feel .next { padding:20px 0 0; }

#shift-img { width:197px; height:118px; overflow:hidden; clear:both; display:block; padding:1px 0; margin:0 0 13px; position:relative; }
#shift-img img { display:block; margin:0; float:left; }
#shift-img #shift-slide { position:relative; width:800px; display:block; }

/* real sound */
.real-sound .page-inner-content { background:url(art/bg-grad.jpg) repeat-x #fff; color:#000; }
.real-sound .intro-par { float:left; }
.real-sound .redbox { float:right; clear:right; margin:10px 0 0; }
.real-sound .main-content { clear:both; padding:0 58px; }
.real-sound .main-content img { padding:0 0 30px; }
.real-sound .main-content .hd { padding:0 0 1em; }

/* videos */
.videos .page-inner-content { background: url(art/bg-grad.jpg) repeat-x #fff; padding:1px 0 0; }
.videos .video-player-container { background:url(art/video-player-bg.png) no-repeat; width:840px; height:550px; padding:20px; margin:150px auto 40px; }

/* faqs */
.faqs .page-inner-content { background:url(art/bg-grad.jpg) repeat-x #fff; color:#fff; }
.faqs .main-content { padding:130px 58px 0; }
.faqs .faq-category .faq-header { height:20px; padding:5px; background:url(art/cat-header.jpg); border:1px solid #222; }
.faqs .faq-category .faq-header h3 { font-weight:bold; font-size:20px; width:450px; float:left; margin:0; line-height:20px; }
.faqs .faq-category .faq-header .actions { float:right; font-size:10px; line-height:11px; padding:4px 0 0; }
.faqs .faq-category .faq-header .actions span { cursor:pointer; }
.faqs .faq-category .faq-header .actions .expand { float:left; }
.faqs .faq-category .faq-header .actions .collapse { float:right; border-left:1px solid #fff; padding:0 0 0 5px; margin:0 0 0 6px; }
.faqs .faq-category ol { clear:both; padding:0 0 15px; margin:0; list-style:none; }
.faqs .faq-category li { padding:0 5px 5px; margin:0; background:url(art/bg-grad.jpg) repeat-x 0 -80px; border:1px solid #333; }
.faqs .faq-category p { margin:0; padding:0; color:#000; border-top:1px solid #fff; }
.faqs .faq-category p a { color:#222; }
.faqs .faq-category p a:hover { color:#fff; }
.faqs .faq-category h4 { margin:0; margin:5px 0; cursor:pointer; font-size:13px; }
.faqs .more-specs { color:#000; padding:0 0 20px 58px; }
.faqs .more-specs a:hover { color:#444; }