/* Style Imports */
 
/* Main Content 
----------------------------------------------------*/
#main_content { padding: 56px 0 0 14px; }
H1 IMG { width:216px }

/* Panels Alternatives
--------------------------------*/
a.panelnav_link .panelnav_thumb_off { background: #3f3f3f; }
a.panelnav_link .panelnav_thumb_off img { display: none; }
a.panelnav_link:hover .panelnav_thumb_on img { display: block; }
a.closedark, a.closelight { margin: 0 0 45px 257px;}

/* SPP Products 
---------------------------------------------*/
/* Product Details
----------------------- */
#prod-container { float: left; }
#prod-details { width: 225px; padding-bottom: 30px; float: left; }
#prod-descr { margin-left: 7px; margin-bottom: 20px; }
.prod-shaded #prod-descr { margin-bottom: 0; }

#prod-descr p,
#prod-descr .descr { 
    width: 200px;
    margin-bottom: 10px;
    margin-top: 7px;
    line-height: 1.2;
} 
/*#prod-descr .all_shades a { }*/

.descr { position: relative; }
#prod-descr .descr .tooltip { 
    display: block;
    width: 200px;
    padding: 7px;
    top: -7px;
    left: -7px;
    color: #ccc;
    background: #323232;
    white-space: normal;
    line-height: 1.2;
}
#descr-full-link { text-decoration: underline; }
.descr-full-link-container { display: block; }

#prod-descr span.size { display: block; height: 13px; overflow: visible; }

#inventory_btn_message { clear: both; font-family:inherit; padding: 4px 0 3px 7px; line-height: 16px; display: none; }

#prod-image-container {width: 233px; min-height: 281px; margin-left: 225px; margin-bottom: 4px;} 
/* #prod-image { } USED? */
img.prod-image-medium {width: 209px; min-height: 281px;}

#cart_confirm_spp .overlay-container { margin-left: -26px; }
#prod-details #add_to_bag_top_container { margin-top: 6px;}
#prod-details #progress_add_to_bag_top { margin: 0 0 0 83px; float: none;}
#prod-details #progress_add_to_bag { clear: both; margin: 8px 0 3px 83px; float: none; height: 20px; }
/*.ie #prod-details #progress_add_to_bag { height: 22px; }*/
.prod-shaded #prod-details #progress_add_to_bag,
.prod-sized #prod-details #progress_add_to_bag,
.prod-multishaded-multiskued #prod-details #progress_add_to_bag { height: 18px; }
/*.ie .prod-shaded #prod-details #progress_add_to_bag { height: 20px; }*/
#prod-details #progress_add_to_fav { clear: both; margin: 8px 0 3px 83px; float: none; height: 19px; }
.visible-inventory-status #inventory_btn_message { display: block; }

/* hide swatches: single-sku, single-shaded prods */
.hide-swatches #prod-options { display: none; }
.hide-swatches #prod-descr { margin-bottom: 12px; }


/* Tabs
-----------------------*/
#prod-tabs { clear: both; width: 462px; margin-bottom: 30px; }
#prod-tabs-nav { /*width: 446px; for no scroll bar */ height: 23px; overflow: hidden; background: url('/images/products/common/tabs_bg.gif') no-repeat 0 0; }
#prod-tabs-nav LI { float: left; height: 23px; margin-right: 4px; }
#prod-tabs-nav LI.tab-last { margin-right: 0; }
#prod-tabs-nav LI A { height: 23px; background: url('/images/products/common/tabs_nav.gif') no-repeat 0 0; padding-left: 9px; display: block; float: left; }
/*#prod-tabs-nav LI A.tab-allshades { background-position: -18px 0; } USED? */
#prod-tabs-nav LI A SPAN { background: url('/images/products/common/tabs_nav.gif') no-repeat right -27px; padding: 8px 9px 0 0; display: block; float: left; height: 23px; cursor: pointer; }
#prod-tabs-nav LI IMG { height: 8px; }
#prod-tabs-nav LI.tab-active A { background-position: -52px 0; }
#prod-tabs-nav LI.tab-active A SPAN { background-position: right -54px; }

#prod-tabs-content { /*width: 437px; border-right: 1px solid #555; for no scroll bar */ background: url('/images/products/common/tabs_bg.gif') repeat-y -462px 0; padding: 0 5px 0 3px; height: 379px; }
/*#prod-tabs #prod-tabs-content_top { background: url('/images/products/common/tabs_bg.gif') no-repeat 0 -22px; overflow: hidden; height: 4px; }*/
#prod-tabs #prod-tabs-content_btm { background: url('/images/products/common/tabs_bg.gif') no-repeat 0 -35px; overflow: hidden; /*width: 446px; for no scroll bar */ height: 3px; }

#scrollbar-container {
    float: right;
    width: 13px;
    height: 379px;
    background: url('/images/products/common/tabs_scrollbg.gif') repeat-y  0 0;
    overflow: hidden;
}
/* .scrollbar-enabled #scrollbar-container { } TO DO: use to show a different display/width of the tab area.  Currently default css takes into account the scroll bar, but that should be changed and the scrollbar accomodating css for elements like #prod-tabs-nav width moved under .scrollbar-enabled inheritance */

#scrollbar-track { position: absolute; width: 12px; height: 379px; }

#scrollbar-handle {
    width: 12px;
    height: 71px;
    cursor: pointer;
    margin-left: 1px;
    background: url('/images/products/common/tabs_scrollhandle.gif') no-repeat 0 0;
}

#prod-tabs #prod-tabs-content #scroll-content-container { height: 379px; overflow: hidden; }
.ie #prod-tabs #prod-tabs-content #scroll-content-container { position: relative; } /* workaround for overflow not working on position: relative children */

#prod-tabs-content .tab-item-container { display: none; margin: 7px 0px 8px 1px; }
#prod-tabs-content .tab-item-active { display: block; }


/* Swatches by Hex
-----------------------*/

/*.swatchset-hex-container {padding-left: 8px; display: none;}*/
/* USED? */
.swatchset-hex-container div {display: block; font-size: .95em; color: #888; line-height: 1.2;}
.swatchset-hex-container div span {cursor: pointer;}

#prod-options { margin-top: 11px; margin-bottom: 6px; clear: both; display: block; }
#prod-options P { margin-left: 7px; margin-bottom: 2px; }


/* 56x56 Thumb Swatches
-----------------------*/
#spp-thumbs-wrapper { float: none; clear: both; }
.ie #spp-thumbs-container { padding-left: 1px; }
.spp-thumbs-no-tabs { padding: 0 0 0 3px; display: block; height: 90px; }
#spp-thumbs-container .swatch-thumb-container { display: block; float: left; width: 62px; height: 62px; }
#spp-thumbs-container .swatch-thumb { width: 56px; height: 56px; display: block; position: relative; margin: 1px 1px 5px 5px; }
#spp-thumbs-container .swatch-thumb IMG { width: 56px; height: 56px; z-index: 1; }
#spp-thumbs-container A.swatch-thumb:hover,
#spp-thumbs-container A.swatch-thumb-selected {
    margin: 0 0 4px 4px;
    border: 1px solid #fff;
    text-decoration: none;
}

.ie #spp-thumbs-container .swatch-thumb-container A:hover { z-index: 50; }
.ie6 #spp-thumbs-container .swatch-thumb-selected { margin-right: 0; left: 0; }

#spp-thumbs-container A.swatch-thumb .tooltip {
    top: -8px;
    border: 1px solid #333333;
    color: #FFF;
    z-index: 9;
    background-color: #999;
}

#spp-thumbs-container A.swatch-thumb:hover .tooltip { visibility: visible; z-index: 10; }

#spp-thumbs-container .thumb-col1 .tooltip,
#spp-thumbs-container .thumb-col2 .tooltip,
#spp-thumbs-container .thumb-col3 .tooltip,
#spp-thumbs-container .thumb-col4 .tooltip { left: 28px; }

#spp-thumbs-container .thumb-col5 .tooltip,
#spp-thumbs-container .thumb-col6 .tooltip,
#spp-thumbs-container .thumb-col7 .tooltip { right: 28px; }

#spp-thumbs-container div.swatchsubset-thumbs-container { display: none; }


/* Swatch Cards
-----------------------*/
#swatch-pop-container { width: 200px; } /* keeps el from pushing right page margin in IE */
#swatch-pop-container .swatchcard-container,
#swatch-pop-container .overlay-container { z-index: 600; }

#swatch-pop-container .pop-card-align-default { margin: 52px 0 0 6px;  }
#swatch-pop-container .pop-card-align-left { margin: 52px 0 0 -132px; }

/* cart confirm popover */
#swatch-pop-container .pop-confirm-align-default { margin: 0; }
#swatch-pop-container .pop-confirm-align-left { margin: 0 0 0 -130px; }

.swatchcard { background: #181818; border: 1px solid #373737; padding: 7px; width: 168px; }

.swatchcard .swatch-lg { display: block; height: 168px; width: 168px; padding-bottom: 7px; }

.swatchcard .close-container { right: 0; }
.swatchcard .close-container a.close-link {
    background: transparent url(/images/common/btn_close.gif) 0 0 no-repeat;
    margin: 0;
}
.swatchcard .close-container a.close-link:hover { background-position: 0 -8px;}

.swatchcard P { padding: 0; margin: 0; line-height: 14px; }
.swatchcard .card-desc { width: 168px; height: 80px; }
.swatchcard .shade-name { color: #fff; }
.swatchcard .btn-add { width: 168px; height: 23px; padding: 2px 0; }
.swatchcard .card-price { color: #fff; }
.swatchcard .card-icons { margin: 4px 0 4px 0; display: block; }
.swatchcard .card-icons IMG { width: 7px; height: 6px; margin-right: 4px; }

.swatchcard .tooltip { display: block; top: -16px; left: 10px; border: 1px solid #000; color: #333; background: #eee; z-index: 200; }

.swatchcard A.card-finish { display: none; /* position: relative; color: #fff; text-decoration: none !important; */ }
.swatchcard A.card-finish:hover .tooltip { visibility: visible; }

.swatchcard #shade-finish-description-swatchcards { width: 160px; white-space: normal; margin-left: -50px; }
.pop-card-align-left .swatchcard #shade-finish-description-swatchcards { margin-left: -110px; }

.swatchcard .card-icons A { position: relative; text-decoration: none !important; }
.swatchcard .card-icons A:hover .tooltip { visibility: visible; }

.swatchcard .inventory-status { height: 16px; visibility: hidden; }
.visible-inventory-status .swatchcard .inventory-status { visibility: visible; }

/* multi-colored prods */
.swatchcard-container-multishaded .swatchcard .card-desc { height: 56px; }
.swatchcard-container-multishaded .swatchcard .card-icons,
.swatchcard-container-multishaded .swatchcard .card-price,
.swatchcard-container-multishaded .swatchcard .inventory-status,
.swatchcard-container-multishaded .swatchcard .btn-add { display: none; }


/* Non-thumbnail tab content
-----------------------*/
.tab-content { margin: 7px 0 0 5px; padding-bottom: 8px; }
.ie .tab-content { padding-bottom: 18px; }

#menu-filter-byfinish { display: none; }

#product-search { display: none; width: 420px; }
#product-search P { display: block; color: #888; width: 350px; float: none; }
#product-search .search-form { display: block; margin: -8px 0 0 -1px; float: left; width: 184px; }
#product-search P#product-search-message { color: #fff; width: 230px; float: left; line-height: 14px; margin-top: 2px; }
#product-search .progress { float: none; clear: both; margin: 100px 0 0 210px; }

/* Reviews & Social Networking
------------------------------*/
#fbLike { clear: both; padding-top: 7px; }

#prod-rating { clear: both; margin: 14px 0 0 8px; }
#prod-rating #prod-rating-links { margin: 5px 0 0 -1px; }
#prod-rating #prod-rating-links A { padding-right: 6px; text-decoration: underline; }
#prod-share { margin: 8px 0 0 8px; }

#BVReviewsContainer { display: none; padding-top:30px; clear:both; }
#BVCustomerRatings { clear: both; padding-top:10px; margin-left:7px; min-height: 60px; }
.ie6 #BVCustomerRatings { height: 60px; }
#BVFrame { visibility: hidden; width: 1px; height: 1px; position: absolute; left: -999px; top: -999px; overflow: hidden; }


/* Discontinued Products
-------------------------*/
.prod-discontinued .price { display: none; }
.discontinued_details #prod-descr { width: 600px; }
.discontinued_details #spp_header { position: relative; }
.discontinued_details .descr {width: 425px !important;}
.discontinued_details .swatchset-thumbs-container {width: 425px !important;}    
.discontinued_details #btn_save_to_favorites, 
.discontinued_details #btn-view-related, 
.discontinued_details  #btn_color_play {float:none;}       

  
/* Looks/Collections/Artistry In Action
---------------------------------------------*/

.artistry_video {margin: 1px 0 30px 0;}
#video_prod_container { margin-top: 20px; }
.rel_video { border-bottom: 1px solid #313131; }

.flash_container { margin: 0 0 20px -15px; }  
#looks_flash { width: 460px; height: 370px; } 
#mpp_header { margin-bottom: 10px; } 
.text_container { margin: 0 0 30px 7px; padding: 0; } 
.text_container p { width: 380px; } 
.descr { line-height: 1.1; } 
#progress_all_to_cart { margin-left: 83px;padding: 3px 0 3px 0;}


/* Favorites
---------------------------------------------*/
.favorites H1 { display:block; text-indent:-5000px; padding-bottom: 0; margin:0px 0px 15px 7px; }


/* Related Content
---------------------------------------------*/

.spp_rel_container { margin: 0; width: 448px; }

H1.prev-purchased { display:block; text-indent:-5000px; padding-bottom: 0; margin:0px 0px 15px 7px; }

.spp_rel_container .bkg_rel_top { background: url(/images/related/bkg_title_top.gif) -1px 0 no-repeat; width: 445px; }
.spp_rel_container div.rel_head { padding: 6px 5px 4px 7px; }
.ie6 .spp_rel_container div.rel_head { padding: 5px 5px 3px 7px; }
.spp_rel_container .rel_content { width: 445px; border-right: 0; }
.spp_rel_container .rel_prod { border-right: 1px solid #313131; }


/* Mac Me Over overlay
---------------------------------------------*/
#overlay-mac-me-over { background-image:url('/images/popup/mmo-popover.jpg'); position:absolute; width:340px; height:70px; top: 280px; left: 204px; }
#overlay-mac-me-over .close-container { top: 4px; right: 4px; }
#overlay-mac-me-over .close-container a.close-link { width: 12px; height: 12px; background-image: none; }
#overlay-mac-me-over #overlay-mac-me-over-link { display: block; width: 324px; height: 68px; }


/* Waitlist Promo
---------------------------------------------*/
#prod-image-flash img.prod-image-medium { width:397px; height:397px; }

#page_overlay_container_div { position:absolute; z-index:30000; padding: 0; margin: 0; top:250px; left:15px; color: white; }

/* Nicki Minaj promo */
#overlay-nickiminaj { width:200px; height: auto; background: #ffbbcc url("/images/popup/nickiminaj/pop_backpink.jpg") 0 0 repeat; border:1px solid white; }
#overlay-nickiminaj .close-container a.close-link { background: url("/images/popup/nickiminaj/close.gif") 0 0 no-repeat; display: block; width: 7px; height: 8px; overflow: hidden; text-indent: -5000px; }
  
/*.ie #prod-options li ul {margin: -4px 0 0 1px; } USED? */

.ie .prod_detail { padding: 8px 0 4px 0; }

.ie6 a.closedark, .ie6 a.closelight { margin: 0 9px 45px 258px; float: right;}
.ie6 #btn_add_to_bag { margin-top: 25px;}
.ie6 #prod-image-container { width: 213px; margin-left: 0; } 
.ie6 .prod_list { margin: 0 0 0 7px; }
.ie6 .prod_detail { padding: 6px 0 4px 0; }
.ie6 #prod-descr { margin-top: 3px; } 
.ie6 .rel_video {height:346px;width:448px;}

