/* main.css Global Stylesheet Created: Creator: Matt Kircher Pixels to Ems ----------------------------------- PX EM PX EM 10 0.625 21 1.313 11 0.689 22 1.375 12 0.750 23 1.438 14 0.875 24 1.500 15 0.938 25 1.563 16 1.000 26 1.625 17 1.064 27 1.688 18 1.125 28 1.750 19 1.188 29 1.813 20 1.250 30 1.875 */ /* Imported Styles --------------------------------------------------------*/ @import url("reset.css"); @import url("clearing.css"); @import url("lightbox.css"); /* General --------------------------------------------------------*/ body{ font-family:Arial, Helvetica, sans-serif; font-size:1em; text-align:center; color:#603913; background:url(../images/page_bg.jpg) top left repeat #D9C488; } a{ color:#DA7727; font-weight:bold; text-decoration:none; } a:hover{ color:#B6631F; } h1{ font-size:2.0em; } h2{ font-size:1.875em; } h3{ font-size:1.25em; } h4{ font-size:1.0em; } h5{ font-size:0.875em; } h6{ font-size:0.75em; } h1, h2, h3, h4, h5, h6{ color:#257936; font-family:Georgia, "Times New Roman", Times, serif; } hr{ color:#CC7210; background-color:#CC7210; border:none; height:1px; margin:20px 0px; } form{ margin:10px 0px; } form label, form .note, form input, form select, form textarea{ font:0.689em Arial, Helvetica, sans-serif; } form input{ padding:2px 3px; } label{ display:block; float:left; width:150px; } fieldset{ padding:15px 0px 10px; } .required_field{ color:#B6631F; font-weight:bold; } #recaptcha_table{ background-color:#FFF; } /*IE6 Transparency display*/ * html img, * html #logo a, * html #functional-nav li.start_nav, * html #functional-nav li.end_nav, * html #main-nav li a, * html #masthead-accent-left, * html #masthead-accent-right, * html #home-find-links, * html #home-find-links li, * html #home-news, * html #contact-info, * html .subpage #subpage-gutter-wrap{ behavior:url(iepngfix.htc); } /* Classes --------------------------------------------------------*/ /* colors */ /* form */ .required{} .required_field{} .required_attention{} .warning{ background-color:#FFAF2F; color:#FFF; font-weight:bold; padding:3px 10px; } /* general elements */ .subhead{ color:#B6631F; } img.large_tile{} span.large_tile_wrap{ display:block; padding:12px 16px 17px 13px; width:123px; height:123px; background:url(../images/image_tiles.png) no-repeat top right transparent; } span.large_tile_wrap span{ display:block; float:left; width:120px; height:120px; overflow:hidden; position:relative; } img.small_tile{} span.small_tile_wrap{ display:block; padding:6px 15px 13px 5px; width:68px; height:68px; background:url(../images/image_tiles.png) no-repeat bottom left transparent; } span.small_tile_wrap span{ display:block; float:left; width:68px; height:68px; overflow:hidden; position:relative; background-color:#000; } .thumbnails li{ float:left; } .thumbnails img.small_tile{ width:68px; position:relative; } a.fancy_button{ display:block; float:left; padding:2px 7px; color:#FFF; background:url(../images/fancy_button_bg.gif) top left repeat-x #590C39; text-transform:capitalize; } .news_item{ clear:both; } .news_item img{ margin:0px 0px 10px; } .news_item img[align="left"]{ margin:0px 10px 10px 0px; } .news_item img[align="right"]{ margin:0px 0px 10px 10px; } /* Wrap --------------------------------------------------------*/ #wrap{ text-align:left; margin:auto; margin-top:20px; width:950px; padding:0px; } /* Header --------------------------------------------------------*/ #header{} #header, #main-nav, #masthead{ width:940px; margin-right:10px; } #masthead-accent-left, #masthead-accent-right{ position:relative; top:-15px; width:99px; height:90px; margin-bottom:-90px; background-image:url(../images/page_flowers.png); background-repeat:no-repeat; } #masthead-accent-left{ float:left; background-position:top left; left:-25px; } #masthead-accent-right{ float:right; background-position:top right; left:25px; } /* Logo --------------------------------------------------------*/ #logo, #logo h1{ display:inline; } #logo a{ cursor:pointer; display:block; float:left; position:relative; z-index:4; top:240px; left:-50px; width:322px; height:200px; background:url(../images/logo.png) top left no-repeat; overflow:hidden; text-indent:-10000px; margin-bottom:-200px; } /* Navigation --------------------------------------------------------*/ /* functional-nav */ #functional-nav{ float:right; margin-right:30px; } #functional-nav li{ float:left; background-color:#CC7210; height:28px; padding:6px 20px 0px 0px; } /*IE6*/ * html #functional-nav li{ padding-top:5px; height:29px; position:relative; top:-1px; } /*IE7*/ * + html #functional-nav li{ padding-top:5px; height:29px; position:relative; top:-1px; } #functional-nav li.start_nav{ padding-left:26px; padding-right:0px; background:url(../images/functional_nav_bg.png) top left no-repeat transparent; } #functional-nav li.end_nav{ padding-right:26px; background:url(../images/functional_nav_bg.png) bottom right no-repeat transparent; } #functional-nav li.start_nav a, #functional-nav li.end_nav a{ display:block; float:left; position:relative; top:-6px; height:23px; padding:11px 20px 0px 0px; background-color:#CC7210; } /*IE6*/ * html #functional-nav li.start_nav a, * html #functional-nav li.end_nav a{ top:-5px; padding-top:9px; height:25px; } /*IE7*/ * + html #functional-nav li.start_nav a, * + html #functional-nav li.end_nav a{ top:-5px; padding-top:9px; height:25px; } #functional-nav li a{ font-size:12px; text-transform:uppercase; color:#FFF; } #functional-nav li a:hover, #functional-nav li.selected a{ color:#F7ECBE; } /* main-nav */ #main-nav{ height:40px; background:url(../images/content_top_bg.png) top left no-repeat transparent; padding-bottom:130px; margin-bottom:-60px; position:relative; z-index:2; } #main-nav ul{ float:right; margin-right:30px; margin-top:8px !important; } #main-nav li{ display:inline; } #main-nav li.end_nav{} #main-nav li a{ display:block; float:left; margin-right:30px; height:29px; background-image:url(../images/main_nav_bg.png); background-repeat:no-repeat; background-color:transparent; position:relative; text-indent:-1000px; overflow:hidden; } #main-nav li a:hover, #main-nav li.selected a{} #main-nav a.mn1{ width:57px; background-position:0px 0px; } #main-nav a.mn2{ width:91px; background-position:-57px 0px; } #main-nav a.mn3{ width:82px; background-position:-148px 0px; } #main-nav a.mn4{ width:71px; background-position:-230px 0px; } #main-nav a.mn5{ width:52px; background-position:-301px 0px; } #main-nav a.mn6{ width:98px; background-position:-353px 0px; } #main-nav li.selected a.mn1, #main-nav a:hover.mn1{ background-position:0px -29px; } #main-nav li.selected a.mn2, #main-nav a:hover.mn2{ background-position:-57px -29px; } #main-nav li.selected a.mn3, #main-nav a:hover.mn3{ background-position:-148px -29px; } #main-nav li.selected a.mn4, #main-nav a:hover.mn4{ background-position:-230px -29px; } #main-nav li.selected a.mn5, #main-nav a:hover.mn5{ background-position:-301px -29px; } #main-nav li.selected a.mn6, #main-nav a:hover.mn6{ background-position:-353px -29px; } /* sub-nav */ #sub-nav{} #sub-nav li{ margin-bottom:15px; } #sub-nav li.end_nav{} #sub-nav li a{ font-size:1.125em; color:#512A0C; } #sub-nav li a:hover, #sub-nav li.selected a{ color:#B6631F; } #sub-nav .small_sub_nav li{ margin-bottom:5px; } #sub-nav .small_sub_nav li a:hover{ color:#B6631F !important; } #sub-nav li.selected .small_sub_nav li a{ color:#733D12; } #sub-nav li.selected .small_sub_nav li.selected a{ color:#B6631F; } #sub-nav li ul{ padding-left:20px; } #sub-nav li ul li a{ font-size:1em; } /* Masthead --------------------------------------------------------*/ #masthead{ height:284px; } #masthead-content{ height:284px; width:940px; overflow:hidden; } #masthead #masthead-flash div{ height:284px; width:940px; } #masthead .home #masthead-flash div{ background:url(../images/content/mastheads/masthead_home.gif) top left no-repeat transparent; } #masthead .about #masthead-flash{ background:url(../images/content/mastheads/masthead_about.gif) top left no-repeat transparent; } #masthead .artists #masthead-flash{ background:url(../images/content/mastheads/masthead_artists.gif) top left no-repeat transparent; } #masthead .piercers #masthead-flash{ background:url(../images/content/mastheads/masthead_piercers.gif) top left no-repeat transparent; } #masthead .news #masthead-flash, #masthead .site #masthead-flash{ background:url(../images/content/mastheads/masthead_news.gif) top left no-repeat transparent; } #masthead .contact #masthead-flash{ background:url(../images/content/mastheads/masthead_contact.gif) top left no-repeat transparent; } /* Content --------------------------------------------------------*/ #content{ background:url(../images/content_bg.png) 10px 0px repeat-y transparent; margin-bottom:50px; } #content p, #content li, #content blockquote{ line-height:1.7em; font-size:0.875em; } .subpage #main-content ul, .subpage #sub-content-right ul{} .subpage #main-content ul li, .subpage #sub-content-right ul li{ padding-left:25px; background:url(../images/flower_bullet_small.png) 0px 2px no-repeat transparent; margin-bottom:7px; } * html .subpage #main-content ul li, * html .subpage #sub-content-right ul li{ padding-left:0px; background:none; list-style:disc; } #content h1, #content h2, #content h3, #content h4, #content h5, #content h6, #content p, #content ul, #content ol, #content dl, #content blockquote{ margin-top:12px; margin-bottom:12px; } #main-content, #sub-content-left, #sub-content-right{ position:relative; z-index:3; } /* main-content */ #main-content{ width:415px; padding:0px 25px; float:left; } #content .wide{ width:620px; padding-right:60px; } /* home stuff */ #home-find-links{ padding:8px 0px 8px 150px; background:url(../images/content/hula_girl_silouette.png) 30px top no-repeat transparent; } #home-find-links li{ padding-left:45px; background:url(../images/flower_bullet.png) top left no-repeat #F3E9C5; font-size:0.75em; margin-bottom:20px; } #home-find-links li b{ font-size:1.16em; color:#7C1753; display:block; } .home-featured-module p{ line-height:1.5em !important; /*font-size:0.689em !important;*/ } .home-featured-module .thumbnails{ width:190px; } #home-news{ padding:35px 50px; background:url(../images/gutter_bg.png) top center no-repeat transparent; } #home-news h4{ padding-bottom:5px; margin-bottom:7px; border-bottom:1px solid #CC7210; } #home-news .wrapper div{ float:left; width:31%; padding:0% 1%; } #home-news .wrapper h5{ font-family:Arial, Helvetica, sans-serif; color:#7C1753 !important; } #home-news .wrapper p{ line-height:1.2em; } #shop-tour-button{ display:block; height:148px; width:100%; text-indent:-10000px; overflow:hidden; background:url(../images/content/shop_tour_button.gif) top left no-repeat transparent; margin-bottom:10px; } /*video*/ #video-page{ background:none; background-color:#000; } #TB_title{ background-color:#FFF !important; } .site #video-list li{ padding-left:0px !important; background:none !important; width:180px; height:150px; margin-right:10px; float:left; text-align:center; margin-bottom:35px !important; } /*rosters*/ #artists-listing{} #artist-roster{} #frequent-guest-roster{} #occational-guest-roster{} #artists-listing h3 i{ color:#B6631F; font-size:0.8em; } .artists #artist-roster .men, .artists #artist-roster .women{ float:left; width:50%; } .artists #frequent-guest-roster ul li, .artists #occational-guest-roster ul li{ float:left; width:40%; } /* site-map */ #site-map{} #site-map div{ float:left; width:45%; margin-right:2%; } /*artist gallery*/ .artists #main-content > .large_tile_wrap, .piercers #main-content > .large_tile_wrap{ float:left; margin:0px 15px 0px 0px; } #artist-gallery{ clear:both; } #gallery-image-frame{ position:relative; z-index:2; background:url(../images/content/galler_active_image_bg.gif) center center no-repeat transparent; } #gallery-image{ width:600px; height:600px; padding:10px; overflow:hidden; text-align:center; } #gallery-image p{ float:left; margin:0px 0px -1000px 0px !important; text-align:center; position:relative; padding:10px 15px; background:url(../images/content/gallery_title_bg.jpg) top left repeat #FFF; font-size:1em; color:#FFF; border-right:1px solid #000; border-left:1px solid #000; } #gallery-thumbs{ width:600px; height:90px; padding-top:15px; padding-bottom:0px; padding-bottom:50px; overflow:hidden; position:relative; z-index:3; top:-120px; margin-left:10px; margin-bottom:-210px; } #gallery-thumbs ul{ position:relative; margin:0px 0px; padding-left:50px; } .subpage #gallery-thumbs ul li{ position:relative; padding-left:0px; background:none; margin-bottom:0px; } #gallery-image-label{ margin:0px 0px 0px 0px; height:12px; position:relative; top:50px; text-align:center; color:#512A0C; font-size:1.25em; font-weight:bold; } /*faq*/ #faq{} #faq h4{ padding-top:15px; margin-top:15px; border-top:1px solid #F8D1A7; } #faq ul h4{ padding-top:0px; margin-top:12px; border:none; } /*contact info*/ #contact-info{ background:url(../images/contact_info_bg.png) top right no-repeat transparent; min-height:200px; padding:35px 30px 30px; text-align:center; } #contact-info .name{ color:#FFF9D1; font-weight:bold; font-size:1em; display:block; margin-bottom:10px; } #contact-info .adr{ font-size:0.875em; line-height:1.2em; color:#EC9EA6; margin-bottom:15px; } #contact-info .postal-code{ display:block; } #contact-info .tel1, #contact-info .tel2, #contact-info .fax{ font-weight:bold; font-size:1em; color:#FFF9D1; } #contact-info .tel1{ margin-bottom:5px; } #contact-info .tel2{ margin-bottom:5px; } #contact-info .fax{ margin-bottom:15px; } #contact-info .mail a{ color:#DC9A3C; } /* sub-content */ #sub-content-left, #sub-content-right{ padding-top:10px; } #sub-content-left{ width:190px; padding-left:50px; float:left; } #sub-content-right{ width:190px; padding-right:50px; float:right; } /* gutter */ #gutter{ clear:both; padding:20px 30px 20px 50px; min-height:190px; position:relative; top:50px; background:url(../images/footer_bg.png) bottom left no-repeat transparent; } .subpage #gutter{ padding:20px 45px 70px 240px; } .subpage #subpage-gutter-wrap{ padding:25px 50px 0px 50px; width:600px; background:url(../images/gutter_subpage_bg.png) top left no-repeat transparent; } .subpage #subpage-gutter-wrap div{ float:left; width:375px; } .subpage #subpage-gutter-wrap .right{ width:200px; float:right; } .subpage #subpage-gutter-wrap .notice p{ font-size:0.689em !important; font-style:italic; } /* Footer --------------------------------------------------------*/ #footer{ padding-bottom:20px; clear:both; } /* navigation */ #footer-navigation{ display:none; } /* footer-functional-nav */ #footer-functional-nav{} /* footer-main-nav */ #footer-main-nav{} /* affiliates */ #affiliates{ margin:10px 32%; } #affiliates li{ display:inline; } #affiliates a{ display:block; float:left; height:72px; margin-right:15px; background-image:url(../images/affiliates_bg.png); background-repeat:no-repeat; text-indent:-10000px; overflow:hidden; } #affiliates a#affiliate_nta{ width:114px; background-position:0px 0px; } #affiliates a#affiliate_apt{ width:62px; background-position:-114px 0px; } #affiliates a#affiliate_app{ width:108px; background-position:-176px 0px; } /* validation */ #validation{ display:none; } /* copyright */ #copyright{ text-align:center; font-size:0.5625em; } /* designed by */ #designed-by{}