.PageHeader { height: 91px; } .PageHeader.Large, .HeaderSpacer { height:121px; } .PageHeader { width:100%; top:0; left:0; position:fixed; z-index:9998; font-family: Helvetica; } .PageHeader .HeaderTopBar { z-index:1100; position:absolute; top: 0px; width: 100%; height:51px; background-image: url(/images/structural/header/backgrounds/HeaderTopBG.png); background-position:bottom; box-shadow: 0 0 5px #666; } .PageHeader .HeaderTop { padding: 6px 0; height:39px; font-size:10px; background: url(/images/structural/header/backgrounds/Header-Nav-Separator.png) no-repeat bottom; } .PreviewMode .PageHeader .HeaderTop { background-image:url('/images/structural/header/backgrounds/Header-Nav-Separator-Preview.png'); } .PageHeader .HeaderTop .SiteLogo { float:left; margin-top:1px; margin-left: 2px; } /*.PageHeader.Small { height: 40px; }*/ /*.PageHeader.Small .HeaderTopBar { height:40px; }*/ /*.PageHeader.Small .HeaderTop { padding: 0px 0; }*/ /*.HeaderSpacer.Large { height: 96px; } .HeaderSpacer.Small { height: 40px; }*/ /* -- Secure Messages Generic Styles -- */ .SecureMessages { float: left; background: url(/images/structural/header/backgrounds/headertopseparator.png) no-repeat right; width:514px; } .SecureMessage { text-decoration: none; float:left; margin:6px 8px 8px 8px; } .SecureMessage .Start { background-position:left top; background-repeat:no-repeat; padding-left:8px; } .SecureMessage .End { background-position:right bottom; background-repeat:no-repeat; padding-right:8px; } .SecureMessage .BG { background-position:center center; } .SecureMessage .Start, .SecureMessage .End, .SecureMessage .BG { height: 26px; background-image:url(/Images/Structural/Header/backgrounds/secureMessageBG.png); } .SecureMessage .Image { float:left; margin-top:3px; margin-right:8px; } .SecureMessage .Text { float:left; display:block; color:#FFF; font-family:Arial, Helvetica, sans-serif; text-shadow: #444 1px 1px 1px; text-decoration: none; text-align:center; padding-top: 4px; font-size:12px; font-weight: bold; text-decoration: none; margin-top:2px; } .SecureMessage.CallCentre { float:right; } .SecureMessage .CallCentreHours { font-size:11px; font-weight:normal; } /* -------------------------- Quick Links Generic Styles -------------------------- */ .PageHeader .QuickLinks { float: right; margin: 8px 0 0; } .PageHeader .QuickLinks ul { margin:0; float: right; } .PageHeader .QuickLinks ul li { float:left; list-style:none; height: 24px; background: url(/images/structural/header/backgrounds/headertopseparator.png) no-repeat right;} .PageHeader .QuickLinks ul li a, .PageHeader .QuickLinks ul li a:link, .PageHeader .QuickLinks ul li a:visited, .PageHeader .QuickLinks ul li a:active { display:block; padding:5px 8px 0 7px; color:#fff; text-decoration:none; font-size: 11px; font-weight:bold;} .PageHeader .QuickLinks ul li a:hover { color: #269e94; } /* --------------------- Search Generic Styles --------------------- */ .PageHeader .Search { float:right; height:24px; padding: 8px 8px 8px 7px; background: url(/images/structural/header/backgrounds/headertopseparator.png) right no-repeat; } .PageHeader .Search .SearchBox { float:left; width:113px; height:24px; border: 0px; background-color:#FFF; padding-left:8px; font-size:11px; line-height:24px; } .PageHeader .Search .SearchButton { float:left; background-image: url(/images/structural/header/search/icons/searchbutton.png); height:24px; width:25px; border: 0px; cursor:pointer; } /* ----------------------- Mini Bag Generic Styles ----------------------- */ .PageHeader .BagSummary { float:right; width: 140px; height:40px; background: url(/images/structural/header/minibag/backgrounds/minibagbgsprite.png) no-repeat; margin:0 7px 0 7px; background-position: 2px 7px; } .PageHeader .BagSummary a{ text-decoration: none;} .PageHeader .BagSummary.Open { background-position: 2px -27px; height: 48px; } .PageHeader.Small .BagSummary.Open { background-position: 2px -27px; height: 40px; } .PageHeader .BagSummary .BagSummaryText { float: left; font-size: 12px; font-weight: bold; height: 17px; text-align: right; width: 76px; color: #FFFFFF; } .PageHeader .BagSummary .BagSummaryText.EmptyBag { color: #666; } .PageHeader .BagSummary .BagTextClipping{float: left;margin-top: 8px;overflow: hidden;padding-top: 4px;height:17px;width: 76px;} .PageHeader .BagSummary .BagSummaryIcon { float:left; margin: 0px; background-image: url('/Images/Structural/Header/MiniBag/Icons/Minibag.png'); width: 30px;height: 39px;} .PageHeader .BagSummary .BagSummaryIcon.EmptyBag { background-image: url('/Images/Structural/Header/MiniBag/Icons/Minibag-next.png'); } .PageHeader .BagSummary .MiniBagTrigger { width: 9px; height: 15px; background-image: url('/Images/Structural/Header/MiniBag/Icons/chevron-bag-sprite.png'); background-position: left -15px; background-repeat: no-repeat; float: right; margin: 12px 10px 0 0; } .PreviewMode .PageHeader .BagSummary .MiniBagTrigger { background-position:0 -30px; } .PageHeader .BagSummary .MiniBagTrigger.Disabled { background-position: left 0; } .PageHeader .BagSummary .BagSummaryIcon .BagSummaryItemCount{ margin-top: 10px;padding-top: 3px;padding-left: 1px; overflow: hidden; position: relative;width: 29px;height: 21px;} .PageHeader .BagSummary .BagSummaryIcon .BagSummaryItemCount span{display: block;height: 15px; color: #2EAFA8;width: 30px;text-align: center;font-size: 11px;font-weight: bold;} .PreviewMode .PageHeader .BagSummary .BagSummaryIcon .BagSummaryItemCount span { color:#a18b64; } .PageHeader .BagSummary .BagSummaryIcon:hover { cursor: pointer; } .PageHeader .Checkout, .PageHeader .ShopMore { margin-top: 8px; } .PageHeader .MiniBag { position:absolute; top: -44px; height: 100px; width:100%; background-color: #242424; } /* ----------------------------- Breadcrumb Nav Generic Styles ----------------------------- */ .PageHeader .BreadcrumbNavigation { background: url(/Images/Structural/Breadcrumbs/Backgrounds/breadcrumb-BG.png); color: #000; height: 30px; overflow:hidden; position:absolute; top:86px; width: 100%; -moz-box-shadow: 0 0 5px rgba(0,0,0,0.6); -webkit-box-shadow: 0 0 5px rgba(0,0,0,0.6); box-shadow: 0 0 5px rgba(0,0,0,0.6); display:none; } .PageHeader .BreadcrumbNavigation.Hidden { margin-top: -32px; } .PageHeader .BreadcrumbNavigation .Back { cursor:pointer; float:left; height:27px; margin-top:1px;} .PageHeader .BreadcrumbNavigation .BreadcrumbsHolder { overflow:hidden; float:left; } .PageHeader .BreadcrumbNavigation .Breadcrumbs { float:left; list-style-image: url(/Images/Structural/Breadcrumbs/Icons/Separator.png); } .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb {list-style: none; float:left; padding-right: 14px; margin-right:10px; /* list-style-image: url(/Images/Structural/Breadcrumbs/Icons/Separator.png); */ background-image: url(/Images/Structural/Breadcrumbs/Icons/Separator.png); background-repeat: no-repeat; background-position: right 14px; font-size: 11px; padding-top: 9px; font-weight:bold; white-space:nowrap; } .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb:last-child { background-image: none; } .PageHeader .BreadcrumbNavigation .Breadcrumbs .lastBreadcrumb { background-image: none; } .PageHeader .BreadcrumbNavigation .Breadcrumbs .bcHome { width: 45px; white-space:normal; } .PageHeader .BreadcrumbNavigation .Breadcrumbs .bcHome a { background-image: url(/Images/Structural/Breadcrumbs/Icons/Home.png); background-repeat: no-repeat; padding-left:18px; background-position: 0 4px; } .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a, .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:active, .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:visited, .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:link { text-decoration: none; padding-top:3px; font-weight:normal; color: #000; } .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:hover { text-decoration: underline; padding-top:3px; font-weight:normal; color: #29ab9f; } /* must include a width for .Breadcrumb.Home - breadcrumb will jump without it out */ .PageHeader .BreadcrumbNavigation .Breadcrumbs .Breadcrumb.Home { list-style: none; padding-top:11px; width:15px; background-image: none;} .PageHeader .BreadcrumbNavigation .Breadcrumbs .BreadcrumbEllipsis { display:none; padding-top:7px; float:left; } .PageHeader .BreadcrumbNavigation .SocialBookmarks { float:right; } .PageHeader .BreadcrumbNavigation .Back .ButtonStart, .PageHeader .BreadcrumbNavigation .Back .ButtonStart .ButtonEnd, .PageHeader .BreadcrumbNavigation .Back .ButtonStart .ButtonEnd .ButtonBG { background-image: url('../Images/Structural/Breadcrumbs/Icons/button-style-header-short.png'); height:27px; } .PageHeader .BreadcrumbNavigation .Back .ButtonStart { background-repeat:no-repeat; padding-left:6px; } .PageHeader .BreadcrumbNavigation .Back .ButtonStart .ButtonEnd .ButtonBG {background-position: 0px -27px; } .PageHeader .BreadcrumbNavigation .Back .ButtonStart .ButtonEnd .ButtonBG .Arrow { margin-top:6px; } .PageHeader .BreadcrumbNavigation .Back .ButtonStart .ButtonEnd .ButtonBG .ButtonText {padding-top:5px; padding-right: 7px; font-weight: normal; font-size: 12px;} .PageHeader .BreadcrumbNavigation .Back .ButtonStart .ButtonEnd {background-position: right -54px; background-repeat:no-repeat; padding-right:6px; } /* ----------------------------- Breadcrumb Nav Generic Styles ----------------------------- */ .BreadcrumbNavigation { background: url(/Images/Structural/Breadcrumbs/Backgrounds/breadcrumb-BG.png); color: #000; height: 32px; overflow:hidden; } .BreadcrumbNavigation.Hidden { margin-top: -32px; } .BreadcrumbNavigation .Back { cursor:pointer; float:left; height:32px;} .BreadcrumbNavigation .Breadcrumbs { float:left; list-style-image: url(/Images/Structural/Breadcrumbs/Icons/Separator.png); } .BreadcrumbNavigation .Breadcrumbs .Breadcrumb { float:left; margin-right: 24px; list-style-image: url(/Images/Structural/Breadcrumbs/Icons/Separator.png); font-size: 11px; padding-top: 9px; font-weight:bold; } .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a, .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:active, .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:visited, .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:link { text-decoration: none; padding-top:3px; font-weight:normal; color: #000; } .BreadcrumbNavigation .Breadcrumbs .Breadcrumb a:hover { text-decoration: underline; padding-top:3px; font-weight:normal; color: #29ab9f; } .BreadcrumbNavigation .Breadcrumbs .Breadcrumb.Home { list-style: none; padding-top:11px; } .BreadcrumbNavigation .SocialBookmarks { float:right; } .addthis_default_style { margin-top: 6px; } #at15s a, #at15s span { color: #000; } /* ----------------------- Mega Nav Generic Styles ----------------------- */ .MegaNavigationLayer { position:absolute; width:100%; height: 388px; top: -996px; } .MegaNavigation { width: 976px; height: 388px; margin: 0 auto; z-index:1; } .MegaNavigation .Left, .MegaNavigation .Right, .MegaNavigation .Sections { background: url(/images/structural/header/navigation/common/backgrounds/MegaNavBG.png) } .MegaNavigation .Left { width:22px; height: 388px; float:left; background-position: bottom left; background-repeat:no-repeat; } .MegaNavigation .Right { width:22px; height: 388px; float:right; background-position: bottom right; background-repeat:no-repeat; } .MegaNavigation .Sections { margin: 0 22px; height: 388px; background-position: top; background-repeat:repeat-x; } .MainNavigation li { list-style:none; max-width: 265px; } /* -------------------------- Mega Nav Functional Styles -------------------------- */ /* Make the Mega Nav containers relative so we can position the Mega Navs as absolute */ .MainNavigation, .MainNavigation .SecondaryNavigation .Component { position:relative; margin-left: 50px;} /* Make the Mega Navs as absolute and hide them off to one side by default .MainNavigation .SecondaryNavigation,*/ .MainNavigation .TertiaryNavigation, .MainNavigation .QuaternaryNavigation { position:absolute; left:-9999px; z-index:999; } /* Make the Mega Navs visible on hover or Active (for jQuery use) */ /* #MainNavigation .PrimaryNavigation li.Active div.SecondaryNavigation { left:0; top:36px; }*/ #MainNavigation .SecondaryNavigation .Component li.Active div.TertiaryNavigation { left:173px; top:0; } #MainNavigation .TertiaryNavigation .Component li.Active div.QuaternaryNavigation { left:173px; bottom:6px; margin-left: 50px; } #MainNavigation .PrimaryNavigation li.Active div.SecondaryNavigation, #MainNavigation .SecondaryNavigation .Component li.Active div.TertiaryNavigation, #MainNavigation .TertiaryNavigation .Component li.Active div.QuaternaryNavigation { z-index:999; } #MainNavigation .PrimaryNavigation li.Active div.SecondaryNavigation{ z-index:9999;} /* ------------------------------- Mega Nav Level-1 Display Styles ------------------------------- */ .HeaderNavigation { width: 998px; height:36px; z-index: 1050; border-top: 1px dotted #999999;border-bottom: 3px solid #5b5957;} .PreviewMode .HeaderNavigation { background-image:url(/Images/Structural/Header/Navigation/Common/Backgrounds/PrimaryNavBGPreview.png); /*TODO: REPLACE IMAGE WITH ACTUAL ASSET*/ } .HeaderNavigation.Hidden { top: 0px; } .HeaderNavigation.SmallHeader { margin-top:40px; } .MainNavigation { height: 34px; margin: 0 auto; font-size:15px; padding-top:2px; } body.msie9 .MainNavigation {width:976px; } .MainNavigation .PrimaryNavigation { margin:0px; background: url(/images/structural/header/navigation/common/backgrounds/primarynavseparator.png) left bottom no-repeat; height: 34px; /* width: 974px; */ display:block; float:left; padding-left:2px; } .PreviewMode .MainNavigation .PrimaryNavigation { background-image:url('/images/structural/header/navigation/common/backgrounds/PrimaryNavSeparatorPreview.png'); } .JSEnabled .MainNavigation .PrimaryNavigation { visibility:hidden; } .msie7 .MainNavigation .PrimaryNavigation, .msie6 .MainNavigation .PrimaryNavigation { display:block; } .MainNavigation .PrimaryNavigation .Department { display: block; list-style: none; height:34px; text-transform:uppercase; float:left; padding: 0px 0px; } .PreviewMode .MainNavigation .PrimaryNavigation .Department { background-image:url('/images/structural/header/navigation/common/backgrounds/PrimaryNavSeparatorPreview.png'); } .MainNavigation .PrimaryNavigation .Department .DepartmentText { padding: 7px 0px 0 0px; height:27px; margin-right:2px; display: block; } /*.msie7 .MainNavigation .PrimaryNavigation .Department .DepartmentText {padding: 7px 7px 0 7px; } */ .msie6 .MainNavigation .PrimaryNavigation .Department .DepartmentText {padding: 7px 7px 0 7px; } .DepartmentText:hover{color: #b65250;} .DepartmentTextActive{background: url('../images/backgroundMenutop.png') no-repeat right center;} .MainNavigation .PrimaryNavigation .Department .DepartmentText, .MainNavigation .PrimaryNavigation .Department .DepartmentImage { position:relative; z-index:1000; cursor:pointer; } .MainNavigation .PrimaryNavigation .Department .DepartmentImage { max-height:36px; display:block; } .MainNavigation .PrimaryNavigation .Department a.DepartmentLink, .MainNavigation .PrimaryNavigation .Department a.DepartmentLink:link, .MainNavigation .PrimaryNavigation .Department a.DepartmentLink:visited, .MainNavigation .PrimaryNavigation .Department a.DepartmentLink:hover, .MainNavigation .PrimaryNavigation .Department a.DepartmentLink:active { color:#fff; text-align: center;} .MainNavigation .PrimaryNavigation .Department a.DepartmentLink { text-decoration:none; } .MainNavigation .PrimaryNavigation .Department a.DepartmentLink img { display:inline; vertical-align: middle; padding: 0 8px 0 10px; } .MainNavigation .PrimaryNavigation li:hover a.DepartmentLink, .MainNavigation .PrimaryNavigation .Department a.DepartmentLink:hover { color: #2BAA9F !important; } .MainNavigation .PrimaryNavigation .Department.Active a.DepartmentLink{ color: #737070 !important; } .PreviewMode .MainNavigation .PrimaryNavigation li:hover a.DepartmentLink, .PreviewMode .MainNavigation .PrimaryNavigation .Department a.DepartmentLink:hover, .PreviewMode .MainNavigation .PrimaryNavigation .Department.Active a.DepartmentLink { color: #fff !important; } @font-face { font-family: Univers_LT_57_Condensed ; src: url(Univers_LT_57_Condensed.ttf) format("truetype"); } .MainNavigation .PrimaryNavigation .Active .DepartmentText, .MainNavigation .PrimaryNavigation .Active .DepartmentImage, .MainNavigation .PrimaryNavigation li.Active:hover .DepartmentText, .MainNavigation .PrimaryNavigation li.Active:hover .DepartmentImage { font-family: Univers_LT_57_Condensed; } .MainNavigation .PrimaryNavigation .Department.Active { position:relative; } .MainNavigation .PrimaryNavigation li.currentDepartment .DepartmentText { background: url(/images/structural/header/navigation/common/backgrounds/selected_arrow_line.png) no-repeat 0px bottom; } .PreviewMode .MainNavigation .PrimaryNavigation li.currentDepartment .DepartmentText { background: url(/images/structural/header/navigation/common/backgrounds/selected_line_preview.jpg) repeat-x bottom; } .MainNavigation .PrimaryNavigation .currentDepartment.Active .DepartmentText, .MainNavigation .PrimaryNavigation .currentDepartment.Active .DepartmentImage, .MainNavigation .PrimaryNavigation li.currentDepartment.Active:hover .DepartmentText, .MainNavigation .PrimaryNavigation li.currentDepartment.Active:hover .DepartmentImage { background: url(/images/structural/header/navigation/common/backgrounds/selected_arrow_line.png) bottom no-repeat; } .PreviewMode .MainNavigation .PrimaryNavigation .currentDepartment.Active .DepartmentText, .PreviewMode .MainNavigation .PrimaryNavigation .currentDepartment.Active .DepartmentImage, .PreviewMode .MainNavigation .PrimaryNavigation li.currentDepartment.Active:hover .DepartmentText, .PreviewMode .MainNavigation .PrimaryNavigation li.currentDepartment.Active:hover .DepartmentImage { background-image: url(/images/structural/header/navigation/common/backgrounds/selected_arrow_line_preview.png); } /* --------------------------------------------------- Mega Nav Level-2 and Below Container Display Styles --------------------------------------------------- */ /* Style the Level-2 Containers */ .MainNavigation .PrimaryNavigation, .MainNavigation .SecondaryNavigation, .MainNavigation .ComponentContainer { zoom:1; } .MainNavigation .SecondaryNavigation, .MainNavigation .SecondaryNavigation .ComponentContainer, .MainNavigation .SecondaryNavigation .PromotionsContainer img { /* -moz-border-radius: 8px; border-radius: 8px;*/ overflow:hidden; } .MainNavigation .SecondaryNavigation .PromotionsContainer{position: relative;} .MainNavigation .SecondaryNavigation .PromotionsContainer ul.Component { width:175px; } .MainNavigation .SecondaryNavigation .PromotionsContainer a::before { content:''; position:absolute; width:175px; height:100%; -moz-box-shadow:inset 0px 0px 4px 1px rgba(0,0,0,0.3); -webkit-box-shadow:inset 0px 0px 4px 1px rgba(0,0,0,0.3); box-shadow:inset 0px 0px 4px 1px rgba(0,0,0,0.3); } .MainNavigation .SecondaryNavigation .ComponentContainer { /* -moz-border-radius: 5px; border-radius: 5px; */ } #MainNavigation .SecondaryNavigation { background-color: #fff; /* background: -moz-linear-gradient(#8c8c8c, #2a2a2a 10%); background: -ms-linear-gradient(#8c8c8c, #2a2a2a 10%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #8c8c8c), color-stop(10%, #2a2a2a)); background: -webkit-linear-gradient(#8c8c8c, #2a2a2a 10%); background: -o-linear-gradient(#8c8c8c, #2a2a2a 10%); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#4c4c4c', endColorstr='#2a2a2a')"; background: linear-gradient(#8c8c8c, #2a2a2a 10%); */ /* -moz-box-shadow: 0px 0px 30px 10px #2a2a2a; -webkit-box-shadow: 0px 0px 30px 10px #2a2a2a; box-shadow: 0px 0px 30px 10px #2a2a2a; */ /* -webkit-box-shadow: 0px 9px 9px rgba(0,0,0,0.4), 0 -2px 2px 1px rgba(0, 0, 0, 0.1) inset; box-shadow: 0px 9px 9px rgba(0,0,0,0.4), 0 -2px 2px 1px rgba(0, 0, 0, 0.1) inset; -moz-box-shadow: 0px 9px 9px #2a2a2a, 0 -2px 2px 1px rgba(0, 0, 0, 0.1) inset; border: 1px solid #ababab; border-top:none; padding: 0 7px 0 0; height: 415px;*/ /*background-image: url('../Images/Structural/Header/Navigation/Common/Backgrounds/secondaryNavBack.png'); background-repeat: repeat-x;*/ } .MainNavigation .SecondaryNavigation .ComponentContainer { /* margin:17px 0 0px 17px; */ border:1px solid #ababab; text-transform:none; float:left; } .MainNavigation .SecondaryNavigation .ProductsContainer {border: none;} .MainNavigation .SecondaryNavigation .CollectionsContainer { /* -webkit-box-shadow: inset 0px 0px 5px 1px rgba(0, 0, 0, 0.3); box-shadow: inset 0px 0px 5px 1px rgba(0, 0, 0, 0.3);*/ } /* Add some shadowage to the top of the Level-2 Containers (note these need applying to containers lower than Level-2 otherwise the shadow will be hidden behind these elements) */ .MainNavigation .SecondaryNavigation .ComponentContainer, .MainNavigation .SecondaryNavigation .TertiaryNavigation, .MainNavigation .SecondaryNavigation .QuaternaryNavigation { /* -moz-box-shadow: inset 0px 10px 10px -10px rgba(000,000,000,0.8); -webkit-box-shadow: inset 0px 10px 10px -10px rgba(000,000,000,0.8); box-shadow: inset 0px 10px 10px -10px rgba(000,000,000,0.8); */ } .MainNavigation .SecondaryNavigation .blockTitle { padding:8px 0px 7px 15px; height:20px; position: relative; z-index: 10000; text-transform: uppercase; } .MainNavigation .SecondaryNavigation .CollectionsContainer .blockTitle { -moz-box-shadow: 0px 3px 3px rgba(0,0,0,0.2); -webkit-box-shadow: 0px 3px 3px rgba(0,0,0,0.2); box-shadow: 0px 3px 3px rgba(0,0,0,0.2); border-bottom: 1px solid #B9B9B9; } .MainNavigation .SecondaryNavigation .ProductsContainer .blockTitle { margin-right: 17px; } /* Level-2 column widths */ .MainNavigation .SecondaryNavigation .Cols-1 { width:175px; } /* IF THIS WIDTH CHANGES, THE getWidthFromClass METHOD IN Next.jQuery.MegaNav.js will need changing */ .MainNavigation .SecondaryNavigation .Cols-2 { width:350px; } /* IF THIS WIDTH CHANGES, THE getWidthFromClass METHOD IN Next.jQuery.MegaNav.js will need changing */ .MainNavigation .SecondaryNavigation .Cols-3 { width:578px; } /* IF THIS WIDTH CHANGES, THE getWidthFromClass METHOD IN Next.jQuery.MegaNav.js will need changing */ .MainNavigation .SecondaryNavigation .Cols-3 { /* background-image: url('../Images/Structural/Header/Navigation/Common/Backgrounds/col3DropShadow.jpg'); background-repeat: no-repeat; background-position: 0px 36px; */ margin-left:4px; margin-right: 8px; } .MainNavigation .SecondaryNavigation div.CollectionsContainer.Cols-2 { width:579px; } /* IF THIS WIDTH CHANGES, THE getWidthFromClass METHOD IN Next.jQuery.MegaNav.js will need changing */ .MainNavigation .SecondaryNavigation div.CollectionsContainer.Cols-3 { width:590px; } /* IF THIS WIDTH CHANGES, THE getWidthFromClass METHOD IN Next.jQuery.MegaNav.js will need changing */ /* Give the Products container a divider */ .MainNavigation .SecondaryNavigation .ProductsContainer ul.Component, .MainNavigation .SecondaryNavigation .LinkOnlysContainer ul.Component { } .MainNavigation .SecondaryNavigation .ProductsContainer ul.Component:first-child, .MainNavigation .SecondaryNavigation .LinkOnlysContainer ul.Component:first-child { background:none; border:none; } /* Set some default dimensions for Level-2 and lower elements */ .MainNavigation .SecondaryNavigation .Component, .MainNavigation .SecondaryNavigation .TertiaryNavigation { width:192px; height:340px; margin:0; } .MainNavigation .SecondaryNavigation .TertiaryNavigation{height:379px; } .MainNavigation .SecondaryNavigation .LinkOnlysContainer .Component { height: 385px; } .MainNavigation .SecondaryNavigation .PromotionsContainer .Component {height: 385px;} .MainNavigation .SecondaryNavigation .PromotionsContainer { height:385px; box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.3) inset; -moz-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.3) inset; -webkit-box-shadow: 0 0 5px 1px rgba(0, 0, 0, 0.3) inset; } .MainNavigation .SecondaryNavigation .PromotionsContainer .Component {padding-top:0px;} #MainNavigation .SecondaryNavigation .Component li.Active div.TertiaryNavigation { width:178px; } #MainNavigation .SecondaryNavigation .ProductsContainer .Component li.Active div.TertiaryNavigation { width:178px; background-color: #E2E3E5; color: #222222; } .MainNavigation .SecondaryNavigation .Component { float:left; padding-top:8px; } #MainNavigation .SecondaryNavigation .ProductsContainer .Component { float:left; padding-top:12px; } #MainNavigation .SecondaryNavigation ul.ActiveChild {width:350px;} #MainNavigation .SecondaryNavigation .ProductsContainer > ul {float:left;} #MainNavigation .SecondaryNavigation .ProductsContainer > ul:first-child {float:left;} /* Make the Level-3 elements bottom align if one of the bottom 6 Level-2 elements are hovered */ .MainNavigation .TertiaryNavigation .Component { height:auto; position:absolute; top:0; } /*.MainNavigation .SecondaryNavigation .ComponentItem:nth-child(n+8) .Component { bottom:15px; top:auto; height:auto; overflow:visible; }*/ .MainNavigation .SecondaryNavigation .ComponentItem:nth-child(n+8) /*.Component { padding-top: 35px; }*/ /*.MainNavigation .SecondaryNavigation .ComponentItem:nth-child(n+8) .Component .QuaternaryNavigation { margin-bottom:-37px; }*/ /* --------------------------------------------------- Mega Nav Level-2 and Below Element Display Styles --------------------------------------------------- */ /* Generic Stuff */ #MainNavigation .SecondaryNavigation .grayscale { /* -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=90)"; filter: alpha(opacity=90); -moz-opacity:0.9; -khtml-opacity: 0.9; opacity: 0.9; -webkit-filter: grayscale(90%); -moz-filter: grayscale(90%); -ms-filter: grayscale(90%); -o-filter: grayscale(90%); */ } #MainNavigation .SecondaryNavigation .CollectionsContainer.grayscale .insetShadow img { /* -webkit-filter: grayscale(90%); -moz-filter: grayscale(90%); -ms-filter: grayscale(90%); -o-filter: grayscale(90%); Required for IE 5, 6, 7 */ /* ...or something to trigger hasLayout, like zoom: 1; */ width: 100%; /* Theoretically for IE 8 & 9 (more valid) */ /* ...but not required as filter works too */ /* should come BEFORE filter */ -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* This works in IE 8 & 9 too */ /* ... but also 5, 6, 7 */ filter: alpha(opacity=50); /* Older than Firefox 0.9 */ -moz-opacity:0.5; /* Safari 1.x (pre WebKit!) */ -khtml-opacity: 0.5; /* Modern! /* Firefox 0.9+, Safari 2?, Chrome any? /* Opera 9+, IE 9+ */ opacity: 0.5; } #MainNavigation .SecondaryNavigation .New { padding-right:35px; background: url(/images/structural/header/navigation/common/logos/new_nav.png) right no-repeat; font-family: Univers_LT_57_Condensed ; } .MainNavigation .SecondaryNavigation .Divider { background:url(/images/structural/header/navigation/common/backgrounds/horizontal_divider.png) 13px 12px no-repeat; } .MainNavigation .SecondaryNavigation .LinkOnlysContainer .Title { background:url(/images/structural/header/navigation/common/backgrounds/horizontal_divider.png) 20px 35px no-repeat; } .MainNavigation .SecondaryNavigation .CollectionsContainer .GlobalSizeLinks { background: url('../Images/Structural/Header/Navigation/Common/Backgrounds/horizontalBarWide.png') no-repeat 16px 0px; } .MainNavigation .SecondaryNavigation .ProductsContainer .GlobalSizeLinks { background:url(/images/structural/header/navigation/common/backgrounds/horizontal_divider.png) 13px 14px no-repeat; } .MainNavigation .SecondaryNavigation a.ViewMore { font-weight:bold; } .MainNavigation .SecondaryNavigation .ComponentItem .Text { cursor:pointer; } .MainNavigation .SecondaryNavigation .ComponentItem.Header .Text { cursor:default; } /* Set some default dimensions and font-sizes for Level-2 and lower elements */ .MainNavigation .SecondaryNavigation .Title, .MainNavigation .SecondaryNavigation .ComponentItem, .MainNavigation .SecondaryNavigation .Divider { min-height:22px; *min-height:22px; *height:22px; } .MainNavigation .SecondaryNavigation .Divider { min-height:22px; height:22px; margin-top:0; } .MainNavigation .SecondaryNavigation .Text { font-size:0.8em; line-height: 15px; } .MainNavigation .SecondaryNavigation .TitleSpacer { height:0px; min-height:0px;display:none; } .MainNavigation .SecondaryNavigation .LinkOnlysContainer .TitleSpacer { height:7px; min-height:7px;display:block; } .MainNavigation .SecondaryNavigation .CollectionsContainer .Title, .MainNavigation .SecondaryNavigation .CollectionsContainer .Text { padding:6px 10px 5px 10px; margin-left:5px; } .MainNavigation .SecondaryNavigation .Title, .MainNavigation .SecondaryNavigation .Text { padding:5px 0px 4px 10px; margin-left:3px; } .MainNavigation .ProductsContainer .Text { padding:5px 0px 4px 10px; margin-left:3px; } .MainNavigation .SecondaryNavigation .Title { text-transform:uppercase; margin-bottom:-16px; padding-top:10px; overflow:hidden; background-color: #fff; font-weight: bold; font-size: 12px; } .MainNavigation .ProductsContainer li.Header, .MainNavigation .ProductsContainer li.Header Text, .MainNavigation .ProductsContainer li.Header Text a { font-weight: bold; font-size: 15px; text-transform:uppercase; } .MainNavigation .ProductsContainer li.Header { margin-bottom: 11px; padding-bottom:1px; background: url("/images/structural/header/navigation/common/backgrounds/horizontal_divider.png") no-repeat scroll 13px 24px transparent; } .MainNavigation .ProductsContainer li.inFlow { height:24px; padding-top:13px; background-position: 13px 37px; margin-bottom: 10px; } .MainNavigation .ContentLoaded .CollectionsContainer.Cols-3 ul.Component, .MainNavigation .ContentLoaded .ProductsContainer.Cols-2 { background-image: url('../Images/Structural/Header/Navigation/Common/Backgrounds/LongGreyVert.png'); background-repeat: no-repeat; background-position: 172px; } .MainNavigation .ContentLoaded .ProductsContainer.Cols-2 { background-position: 172px 36px; } .MainNavigation .ContentLoaded .CollectionsContainer.Cols-2 ul.Component { background-image: url('../Images/Structural/Header/Navigation/Common/Backgrounds/LongGreyVert.png'); background-repeat: no-repeat; background-position: 166px 0px; } .MainNavigation .TertiaryNavigation .Component { height:370px; } /* Level-2 and below colours */ .MainNavigation .SecondaryNavigation a { text-decoration:none; background-color:transparent; } .MainNavigation .SecondaryNavigation div.ComponentContainer > ul.Component > li.MegaNavEnabled.Active > div.Text { background:url(../images/hover_arrow.png) 152px 7px no-repeat; } .PreviewMode .MainNavigation .SecondaryNavigation div.ComponentContainer > ul.Component > li.MegaNavEnabled.Active > div.Text { background-image:url('../images/hover_arrow_preview.png'); } /* Hover: Green Underlined Text */ .MainNavigation .SecondaryNavigation a:hover, .MainNavigation .SecondaryNavigation li.ComponentItem:hover > div.Text > a, .MainNavigation .SecondaryNavigation a:hover > span.GlobalIcon, .MainNavigation .SecondaryNavigation .GlobalSizeLinks div.Text > a:hover, .MainNavigation .SecondaryNavigation li.Active > div.Text > a { color:#2BAA9F; text-decoration:none; } .PreviewMode .MainNavigation .SecondaryNavigation a:hover, .PreviewMode .MainNavigation .SecondaryNavigation li.ComponentItem:hover > div.Text > a, .PreviewMode .MainNavigation .SecondaryNavigation a:hover > span.GlobalIcon, .PreviewMode .MainNavigation .SecondaryNavigation .GlobalSizeLinks div.Text > a:hover, .PreviewMode .MainNavigation .SecondaryNavigation li.Active > div.Text > a { color:#a18b64; } /* White BG, Black Text */ .MainNavigation .SecondaryNavigation .CollectionsContainer, .MainNavigation .SecondaryNavigation .CollectionsContainer a { color:#222; } .MainNavigation .SecondaryNavigation .CollectionsContainer { background-color:#fff; } /* Black BG, White Text */ .MainNavigation .SecondaryNavigation .ProductsContainer, .MainNavigation .SecondaryNavigation .LinkOnlysContainer, .MainNavigation .SecondaryNavigation .ProductsContainer a, .MainNavigation .SecondaryNavigation .LinkOnlysContainer a { color:#222222; } .MainNavigation .SecondaryNavigation .ProductsContainer, .MainNavigation .SecondaryNavigation .LinkOnlysContainer { /*background-color:#2a2a2a;*/ background-color: #fff; } .MainNavigation .SecondaryNavigation .LinkOnlysContainer{margin-left:3px; border: none;} /* Grey BG, Black Text */ .MainNavigation .SecondaryNavigation .CollectionsContainer .TertiaryNavigation, #MainNavigation .SecondaryNavigation .CollectionsContainer li.MegaNavEnabled.Active > div.Text { background-color:#e2e3e5; color:#222; } .MainNavigation .SecondaryNavigation .CollectionsContainer .TertiaryNavigation a { color:#222; } /* White BG, Black Text - This needs to be below the TertiaryNavigation style so that it overrides them */ #MainNavigation .SecondaryNavigation .CollectionsContainer.Cols-3 .TertiaryNavigation li.MegaNavEnabled.Active > div.Text, .MainNavigation .SecondaryNavigation .CollectionsContainer .QuarternaryNavigation, .MainNavigation .SecondaryNavigation .CollectionsContainer .QuarternaryNavigation a { background-color:#fff; color:#222; } #MainNavigation .SecondaryNavigation .CollectionsContainer.Cols-3 .TertiaryNavigation li.MegaNavEnabled.Active > div.Text { background-image: url("/images/structural/header/navigation/common/logos/hover_arrow.png"); background-repeat: no-repeat; background-position: 150px 9px; } /* White BG, Black Text */ #MainNavigation .SecondaryNavigation .ProductsContainer li.MegaNavEnabled.Active > div.Text, .MainNavigation .SecondaryNavigation .ProductsContainer .TertiaryNavigation, .MainNavigation .SecondaryNavigation .ProductsContainer .TertiaryNavigation a { color:#363636; } /* Make a pretty rounded box appear around selected Level-2 links (and Level-3 in some cases) */ #MainNavigation .SecondaryNavigation .CollectionsContainer li.MegaNavEnabled.Active > div.Text, #MainNavigation .SecondaryNavigation .ProductsContainer li.MegaNavEnabled.Active > div.Text { -moz-border-radius-topleft: 5px; -moz-border-radius-bottomleft: 5px; border-top-left-radius: 5px; border-bottom-left-radius: 5px; /*-moz-box-shadow: inset 1px 2px 2px 0px #bbb; -webkit-box-shadow: inset 1px 2px 2px 0px #bbb; box-shadow: inset 1px 2px 2px 0px #bbb; */ background-color: #F4F4F4; border: 1px solid #B9B9B9; padding-top: 5px; padding-bottom:4px; padding-left:9px; } /* Collection Description Styling */ .MainNavigation .SecondaryNavigation .CollectionDetails { display:none; } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails { display:block; position: absolute; /* width: 150px;*/ margin-left:167px; top:0px; height:335px; background-color: #F4F4F4; padding:1px 17px 0 19px; /* -webkit-box-shadow: inset -3px -2px 3px 0px rgba(0, 0, 0, 0.2); box-shadow: inset -3px -2px 3px 0px rgba(0, 0, 0, 0.2);*/ } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails p { font-size: 12px; line-height:120%; margin-top:5px; margin-bottom:2px; } #MainNavigation .SecondaryNavigation .CollectionDetails .New{ background-image:none;} .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .Text { padding:0; margin:0; background: url("/images/structural/header/navigation/common/logos/hover_arrow.png") no-repeat scroll 88px 3px transparent; } .PreviewMode .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .Text { background-image:url('/images/structural/header/navigation/common/logos/hover_arrow_preview.png'); } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .Text a { color: #2BAA9F; } .PreviewMode .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .Text a { color:#a18b64; } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .collectionImage { padding:5px; /* background-color:#E0E0E0; /* width:133px;*/ height:200px; /* -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;*/ margin-top: 60px; } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .collectionImage:hover { background-color: #29ACA0 } .PreviewMode .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .collectionImage:hover { background-color:#a18b64; } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .collectionImage a { display:block; position:relative; } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .collectionImage a::before { content:''; position:absolute; width:100%; height:100%; -moz-box-shadow:inset 0px 0px 3px 1px rgba(0,0,0,0.8); -webkit-box-shadow:inset 0px 0px 3px 1px rgba(0,0,0,0.8); box-shadow:inset 0px 0px 3px 1px rgba(0,0,0,0.8); } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails .collectionImage img { height:200px; /* width:133px;*/ } .MainNavigation .SecondaryNavigation .grayscale li.Active .CollectionDetails .collectionImage img { opacity:1!important; } .MainNavigation .SecondaryNavigation li.Active .CollectionDetails h3 { font-size: 13px; margin-bottom:5px; margin-top:0px; } /* Styles for the QuaternaryNavigation box */ .MainNavigation .QuaternaryNavigation { background:#fff; padding:36px 0 0 8px; /* width:235px; */ height:365px; margin:0; font-size:0.8em; *padding-top:19px; } .MainNavigation .QuaternaryNavigation .Title, .MainNavigation .QuaternaryNavigation .Image, .MainNavigation .QuaternaryNavigation .Description { display:block; } .MainNavigation .QuaternaryNavigation .Title, .MainNavigation .QuaternaryNavigation .Description { padding:8px 12px; } .MainNavigation .SecondaryNavigation .QuaternaryNavigation .Title { font-weight:bold; text-transform:none; padding-top:8px; margin-left:0; padding-bottom:0; } .MainNavigation .SecondaryNavigation .QuaternaryNavigation span.Title{ margin-bottom:0; padding-bottom:0; padding-top:7px; height:20px; min-height: 20px;} .MainNavigation .QuaternaryNavigation .Image { margin-left:8px; } .MainNavigation .QuaternaryNavigation .Image .insetShadow { max-width:198px; box-shadow:inset 0px 0px 7px rgba(0,0,0,.7); -webkit-box-shadow:inset 0px 0px 7px rgba(0,0,0,.7); -moz-box-shadow:inset 0px 0px 7px rgba(0,0,0,.7); border:1px solid red; display:block; padding:0; border: 5px solid #dedee0; -moz-border-radius: 5px; border-radius: 5px; min-height: 84px; } .MainNavigation .QuaternaryNavigation .Image .insetShadow:hover { border-color:#2BAA9F; } .MainNavigation .QuaternaryNavigation .Image a { opacity:0.0; filter:alpha(opacity=0); } .MainNavigation .QuaternaryNavigation .Image img { z-index: -1; position: relative; max-width:198px; /* min-height: 84px; */ } #MainNavigation .QuaternaryNavigation a { background-color:transparent; color:#000; } #MainNavigation .QuaternaryNavigation a:hover {color:#2BAA9F; text-decoration:underline; } /* Global Size Links */ .MainNavigation .SecondaryNavigation div.CollectionsContainer.Cols-3 .GlobalSizeLinks { position:absolute; bottom:10px; left:350px; width:230px; padding: 10px 0 5px 0; z-index:1000; } .MainNavigation .SecondaryNavigation div.CollectionsContainer.Cols-2 .GlobalSizeLinks { display:none; } .MainNavigation .SecondaryNavigation div.ProductsContainer .GlobalSizeLinks { position:relative; bottom:auto; left:0px; width:175px; padding: 24px 0 5px 0; z-index:1000; } .MainNavigation .SecondaryNavigation .CollectionsContainer .GlobalSizeLinks .Text { padding: 4px 10px; } .MainNavigation .SecondaryNavigation .ProductsContainer .GlobalSizeLinks .Text { padding: 5px 10px; } .MainNavigation .SecondaryNavigation .GlobalIcon { padding:4px 0 4px 25px; } .MainNavigation .SecondaryNavigation .PetiteIcon { padding-left:20px; background:url(/images/structural/header/navigation/common/logos/petite_fit.png) no-repeat;} .MainNavigation .SecondaryNavigation .PlusIcon { padding-left:20px; background:url(/images/structural/header/navigation/common/logos/plus_fit.png) no-repeat;} .MainNavigation .SecondaryNavigation .TallIcon { padding-left:20px; background:url(/images/structural/header/navigation/common/logos/tall_fit.png) no-repeat;} /* Overrides for the Products Container when it is mixed with a Collections Container and is in the Expanded state */ #MainNavigation .SecondaryNavigation div.ProductsContainer.ExpandedState ul.ActiveChild { width:400px; } #MainNavigation .SecondaryNavigation div.ProductsContainer.ExpandedState .Component li.Active { width:200px; } #MainNavigation .SecondaryNavigation div.ProductsContainer.ExpandedState .Component li.Active div.TertiaryNavigation { width:217px; left:198px; *width:202px; } #MainNavigation .SecondaryNavigation div.ProductsContainer.ExpandedState > ul.Component > li.MegaNavEnabled.Active > div.Text { background-position: 175px 9px; } #MainNavigation .SecondaryNavigation div.ProductsContainer.ExpandedState ul.Component:last-child li.Active .TertiaryNavigation { width:202px; } #MainNavigation .SecondaryNavigation div.ProductsContainer ul.Component{height:370px; } #MainNavigation .SecondaryNavigation div.ProductsContainer ul.Component:nth-child(4) { } /* For Chrome and Firefox, the square corners contained within curved corner elements show through. Lets make them curvey */ #MainNavigation .SecondaryNavigation div.CollectionsContainer.Cols-2 .TertiaryNavigation, #MainNavigation .SecondaryNavigation div.ProductsContainer ul.Component:last-child .TertiaryNavigation, #MainNavigation .QuaternaryNavigation { -moz-border-radius-topright: 5px; -moz-border-radius-bottomright: 5px; border-top-right-radius: 5px; border-bottom-right-radius: 5px; } /* =secure checkout bar ------------------------------------ */ .MainNavigation ul#steps { background:url(/images/structural/header/secure/chevrons/step-enddivider.png) no-repeat left bottom; float: right; } .MainNavigation ul#steps li { background:url(/images/structural/header/secure/chevrons/step-divider.png) no-repeat right bottom; height: 34px; line-height: 34px; padding: 0 19px 0 9px; color: #999; float:left; font-weight:bold; } .MainNavigation ul#steps li.last { background: none; padding-right: 14px; } .MainNavigation ul#steps li.first { width: auto; padding-right: 30px; text-align: left; /* overrides default #mn styles */ } .MainNavigation ul#steps li.first.active strong { background: url(/images/structural/header/secure/chevrons/FirstStep-Active.png) no-repeat left top; padding-left: 15px; } .MainNavigation ul#steps li.active, .MainNavigation ul#steps li.last-active { background: url(/images/structural/header/secure/chevrons/step-divider.png) no-repeat right 0px; padding: 0px 16px 0 0; height: 34px; width: auto !important; *width: .1em; white-space: nowrap; margin-left: -18px;} .MainNavigation ul#steps li.last-active { background: url(/images/structural/header/secure/chevrons/step-active.png) no-repeat right top; } .MainNavigation ul#steps li.active strong, .MainNavigation ul#steps li.last-active strong { background: url(/images/structural/header/secure/chevrons/step-active.png) repeat-x left 1px; *background: url(/images/structural/header/secure/chevrons/step-active.png) repeat-x left top; display: block; line-height: 34px; padding: 0 6px 0 23px; color: #fff; text-shadow: #444 1px 1px 1px; width: auto !important; *width: .1em;} .MainNavigation ul#steps li.last-active strong { padding-right: 0px; } .HeaderNavigation.Secure .MainNavigation { background: url(/images/structural/header/navigation/common/backgrounds/primarynavseparator.png) right no-repeat; } .addedToBagDialogue{background-position: 10px 0px;position: absolute;width: 222px;min-height: 140px;opacity: 0; background-image: url('../IMAGES/Structural/Arrows/UpSolid.png'); background-repeat: no-repeat; padding-top: 9px; cursor:pointer; /* "pointer" used as .addedToBagDialogue has a click event which redirects to a different page (therefore gives the apperance of an anchor) */ } .addedToBagDialogue .innerAddedToBagDialogue { min-height: 130px; width: 210px; background: rgb(255, 255, 255) transparent; background: rgba(255, 255, 255, 0.985); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#efffffff, endColorstr=#efffffff); -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#efffffff, endColorstr=#efffffff)"; border-radius: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; border: 1px solid #5DB4AB; -moz-box-shadow: 0px 5px 7px rgba(000, 000, 000, 0.3); -webkit-box-shadow: 0px 5px 7px rgba(000, 000, 000, 0.3); box-shadow: 0px 5px 7px rgba(000, 000, 000, 0.3); padding: 7px; } .addedToBagDialogue .innerAddedToBagDialogue h4{ color: #3f3f3f;line-height: 100%; font-weight:normal; float: left;margin-top: 5px; font: 12px Helvetica, Arial, sans-serif } .addedToBagDialogue .innerAddedToBagDialogue a.viewBagLink{ float: right; display: block; width: 65px; height: 16px; text-align: center; text-decoration: none; font-weight: bold; font-size: 11px; color: #fff; padding: 5px; background-color: #242424; background: -moz-linear-gradient( top, #6b6b6b 0%, #242424); background: -webkit-gradient( linear, left top, left bottom, from(#6b6b6b), to(#242424)); border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; border: 0px solid #000000; -moz-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,0.5); -webkit-box-shadow: 0px 1px 3px rgba(000,000,000,0.5), inset 0px 0px 1px rgba(255,255,255,0.5); margin-bottom: 7px; } .addedToBagDialogue .innerAddedToBagDialogue img.hr { width:210px; margin-bottom:5px; } .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper img { float: left;margin-right: 5px;height: 72px; width:48px; border: 1px solid #e2e2e2;} .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail{ float: left;min-height: 70px;} .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail span{ display: block;color: #000; font-size: 12px;} .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail span.itemStatus{ font-weight: bold;padding-top: 3px;margin-bottom: 3px;width: 155px;} .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail span.itemStatus { background-position: right top; background-repeat: no-repeat; } .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail span.instock { background-image: url('/IMAGES/Structural/ShoppingBag/in_stock.gif'); } .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail span.delayed { background-image: url('/IMAGES/Structural/ShoppingBag/delayed.gif'); } .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail span.soldOut { background-image: url('/IMAGES/Structural/ShoppingBag/sold_out.gif'); } .addedToBagDialogue .innerAddedToBagDialogue .itemWrapper .itemDetail span.itemPrice{ font-weight: bold;font-size: 12px;margin-top: 3px;} .addedToBagDialogue .multipleBagItemSeperator{ margin: 11px 0; border-top: 1px solid #E2E1E1; width:207px; height:1px;} .PageHeader .BreadcrumbNavigation .Breadcrumbs li.Breadcrumb:first-child img { float: left; margin-right: 7px; padding-top: 1px; } /* Menu Positions - */ .SNDefault { left:-9999px; opacity:0; /* height:450px;*/ /* width:966px;*/ position:absolute; top:-1000px; } .SNAnimateLeft { left:-1000px; opacity:0; -webkit-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -moz-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -ms-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -o-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); /* easeOutCubic */ } .SNStaticLive { top:34px; left:0px; opacity:1; } .SNHiddenLive { left:0px; opacity:0; } .SNAnimateLive { left:0px; opacity:1; -webkit-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -moz-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -ms-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -o-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); /* easeOutCubic */ } .SNOpacityIn { opacity:1; -webkit-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -moz-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -ms-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -o-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); /* easeOutCubic */ } .SNOpacityOut { opacity:0; -webkit-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -moz-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -ms-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -o-transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); transition: all 300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); /* easeOutCubic */ } .SNAnimateRight { left:1000px; opacity:0; -webkit-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -moz-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -ms-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -o-transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); transition: all 500ms cubic-bezier(0.215, 0.610, 0.355, 1.000); /* easeOutCubic */ } .SNStaticLeft { left:-1000px; opacity:0; } .SNStaticRight { left:1000px; opacity:0; } /* Vertical transitions */ .MaskingRegion { height:450px; width:990px; position:absolute; overflow:hidden; left:0px; top:36px; } .SNStaticUp { top:-410px; left:0px; opacity:1; } .MaskingRegion .SNStaticDown { top:0px; opacity:1; left:0px; } .SNAnimateDown { top:36px; left:0px; opacity:1; -webkit-transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); -moz-transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); -ms-transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); -o-transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); transition: all 500ms cubic-bezier(0.190, 1.000, 0.220, 1.000); /* easeOutExpo */ } .MaskingRegion .SNAnimateDown { top:0px; opacity:1; left:0px; } .MaskingRegion .SNAnimateUp { top:-410px; left:0px; opacity:1; -webkit-transition: all 400ms cubic-bezier(0.550, 0.085, 0.680, 0.530); -moz-transition: all 400ms cubic-bezier(0.550, 0.085, 0.680, 0.530); -ms-transition: all 400ms cubic-bezier(0.550, 0.085, 0.680, 0.530); -o-transition: all 400ms cubic-bezier(0.550, 0.085, 0.680, 0.530); transition: all 400ms cubic-bezier(0.550, 0.085, 0.680, 0.530); /* easeInQuad */ } /* Masked swipe */ .MaskingRegion .SNStaticPreSwipe { opacity:1; left:0px; } .MaskingRegion .SNSwipeRight { left:900px; -webkit-transition: all 1300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -moz-transition: all 1300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -ms-transition: all 1300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); -o-transition: all 1300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); transition: all 1300ms cubic-bezier(0.215, 0.610, 0.355, 1.000); /* easeOutCubic */ } /* Loading elements */ .SecondaryNavigation .placeholder { height:384px; } .SecondaryNavigation .placeholder img.placeholderLoader { position: relative; top: 50%; margin-top:-16px; left: 50%; margin-left:-16px; } img.loadingBar{position: relative; top: 50%; margin-top:-10px; left: 50%; margin-left:-110px;}