/* Template Name: Roots BigCommerce Description: Starting template for BigCommerce Version: 2.6.1 Author: Madwire Media Author URI: http://www.madwirewebdesign.com/ Updated: October 12 2011 */ /* *** TABLE OF CONTENTS *** ------------------------------------------------------------------------------ Following the name of each section is -n- and a 3 digit code, for example abc, which you can use find or find next to skip to the next section. PLEASE LOOK THROUGH CSS BEFORE EDITING IT TO SEE WHAT EACH SECTION CONTAINS ------------------------------------------------------------------------------ Base = bas Primary Container Widths, Base Styles, and Blue Reset Styles = prm Header = hdr Content = cnt Sidebar = sdb Footer = ftr Miscelaneous = msc (breadcrumb styles are in here and some other stuff) Pages = pgs Category = ctg Product Lists = pls Product = prd Cart = crt Checkout -n- = chk Account = act Home Page = hpg Internet Explorer 7 = ie7 Media Queries = mqs Plugins = plg /* /* ============================================================================= Base -n- bas ========================================================================== */ html { overflow-y: scroll; } body { background: #fff; font-size: 87.5%; } h1,h2,h3,h4,h5,h6 { text-shadow: 0 1px 1px rgba(0, 0, 0, 0.15); } ul.none { margin: 0 0 1.5em 0; padding: 0; list-style: none; } .icon { vertical-align: middle; } img.left, p img.left { margin: 0 1.5em 1.5em 0; float: left; } img.right, p img.right { margin: 0 0 1.5em 1.5em; float: right; } /* == Non-semantic helper classes ============================================= */ /* image replacement */ .ir { display : block; text-indent : -999em; overflow : hidden; background-repeat : no-repeat; text-align : left; direction : ltr; } /* hide for both screenreaders and browsers */ .hidden { display : none; visibility : hidden; } /* hide only visually, but have it available for screenreaders */ .visuallyhidden { position : absolute; clip : rect(0 0 0 0); overflow : hidden; margin: -1px; padding : 0; height : 1px; width : 1px; border : 0; } /* extends the .visuallyhidden class to allow the element to be focusable when navigated to via the keyboard */ .visuallyhidden.focusable:active, .visuallyhidden.focusable:focus { position : static; clip : auto; overflow : visible; height : auto; margin : 0; width : auto; } /* hide but maintain layout */ .invisible { visibility : hidden; } /* == Links & Selection ===================================================== */ a, .Content a { color: #00AEEE; } a:hover, .Content a:hover, a:focus, .Content a:focus { color: black; } a:hover, a:active { outline: none; } a:active, input.button:active, input[type=submit]:active, input[type=button]:active { outline: 0; position: relative; top: 1px; } a.ChangeLink:active { position: absolute; top: auto; right: 15px; } a:active.modalClose { position: absolute; top: 10px; } a:link { -webkit-tap-highlight-color: #3399FF; } ::-moz-selection { text-shadow: none; background: #3399FF; color: #fff; } ::selection { text-shadow: none; background: #3399FF; color: #fff; } /* == Buttons =============================================================== */ .button, .Content a.button, input[type=submit], input[type=button] { display: inline-block; background: #636363; -moz-border-radius: 6px; -webkit-border-radius: 6px; border-radius: 6px; color: white; border: none; padding: 8px 16px; cursor: pointer; text-decoration: none; text-transform: capitalize; width: auto!important; overflow: visible; } .button:hover, .Content a.button:hover, input[type=submit]:hover, input[type=button]:hover { background: #a3a3a3; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2EzYTNhMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjcwJSIgc3RvcC1jb2xvcj0iI2QxZDFkMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2RiZGJkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YzdjN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #a3a3a3 0%, #d1d1d1 70%, #dbdbdb 80%, #7c7c7c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a3a3a3), color-stop(70%,#d1d1d1), color-stop(80%,#dbdbdb), color-stop(100%,#7c7c7c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* IE10+ */ background: linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3a3a3', endColorstr='#7c7c7c',GradientType=0 ); /* IE6-8 */ color: black; text-decoration: none; } .button.download { margin-bottom: 10px; } .AccountOrderStatusList li form { margin-bottom: 4px; } #ProductReviews .button { float: right; } #LoginButton { padding: 8px 16px !important; margin-bottom: 12px; } .AddCartButton input.button { margin: -4px 0 0 10px; } .CheckoutButton { margin-bottom: 1.5em; } .ProceedToCheckout a.button { padding: 8px 16px; color: #fff; } .BulkDiscount .button { margin:0!important; } /* == Forms =================================================================== */ input, select, textarea { font-family: sans-serif; font-size: 1em; } button, input, input.Textbox, input[type=text], select, textarea { margin: 0; padding: 3px; } label, input[type=button], input[type=submit], button { cursor: pointer; } button { width: auto; overflow: visible; } textarea { overflow: auto; } #LoginForm form input[type=text] { margin: 0; } .HorizontalFormContainer dd { padding: 8px 0 0; } .HorizontalFormContainer dt { padding: 10px 0 0; } /* == Tables ================================================================== */ .EstimateShipping, .CheckoutRedeemCoupon { background: #F4F4F4; border: 1px solid #e5e5ef; color: #4d4d50; } table.CartContents, table.General { border: 1px solid #e5e5ef; } .CartContents thead tr th, table.General thead tr th { background: #F4F4F4; border-bottom: 1px solid #e5e5ef; color: #4d4d50; } .CartContents tfoot .SubTotal td { border-top: 1px solid #e5e5ef; color: #4d4d50; } .CompareItem { border-left: solid 1px #e5e5ef; } .CompareFieldName { font-weight:bold; border-bottom: 1px solid #e5e5ef; } .CompareFieldTop { border-bottom:solid 1px #e5e5ef; } .CompareFieldTop a:hover { color:red; } .CompareCenter { border-left:solid 1px #e5e5ef; border-bottom:solid 1px #e5e5ef; } .CompareLeft { border-left:solid 1px #e5e5ef; border-bottom:solid 1px #e5e5ef; } .ComparisonTable tr:hover td { background: #F7F7F7; } /* ============================================================================= Primary Container Widths, Base Styles, and Blue Reset Styles -n- prm ** MEANT FOR BASIC STRUCTURE for example widths, margins, padding and for background images/colors for the basic structure elements ** NOT FOR CONTENT SPECIFIC STYLES for example styling what is inside the header, footer, content areas, etc. ** USE APPROPRIATE SECTION(S) FOR THAT ========================================================================== */ #html {} #body {} #Container { width: auto; margin: 0; } #Outer { background: none; margin: 0; } #TopMenu, #Header, #PrimaryMenu, #Wrapper, #Footer { width: 950px; margin: 0 auto; } #TopMenuOuter, #HeaderOuter, #PrimaryMenuOuter, #WrapperOuter, #FooterOuter { width: 100%; } #Header, #Footer, #PrimaryMenuOuter { position: relative; } #TopMenu, #Header { height: auto; } #Header, #Footer { padding: 0; border: none; } #Header ul, #PrimaryMenu ul, #Footer ul { list-style: none; margin: 0; padding: 0; } #TopMenuOuter { margin-bottom: 15px; } #TopMenu {} #HeaderOuter { position: relative; } #Header {} #PrimaryMenuOuter { margin-bottom: 16px; } #PrimaryMenu {} #WrapperOuter {} #Wrapper { text-align: left; } #FooterOuter { display:inline-block;} #Footer { clear: both; } .Content, .Content.Wide, .Content.Widest { background: none; } .Content { width: 550px; margin: 0 10px 0 0; padding: 0; font-size: 1em; } .Content.Wide { width: 730px; margin: 0; padding: 0; } .Content.Widest { width: 950px; margin: 0; padding: 0; } /*Sidebars*/ .Left, .Right { background: none; } .Left h2, .Right h2 { width: auto; } .Left li, .Right li { border: none; } .Left { width: 210px; } .Right { width: 170px; margin: 0; } /* ============================================================================= Header -n- hdr ========================================================================== */ /* == TopMenu =============================================================== */ #TopMenuOuter {} #TopMenu {} #TopMenu ul { float: right; } #TopMenu li a, #TopMenu li div { color: #06c; border: none; font-size: .95em; margin: 8px 0 0 0; padding: 0 10px; } #TopMenu li a:hover { color: #09f; } /* == Header ================================================================ */ #HeaderOuter {} #Header { position: relative; height: 136px; } #headerContact { position: absolute; top: 24px; right: -6px; height: 30px; min-width: 375px; clear: right; font-size: 16px; color: black; } #headerContact div { padding: 0 10px; height: 30px; float: right; font-size: 12px; font-weight: bold; line-height: 1.1; } #headerContact .phoneNumber { text-align: right; border-right: 1px dashed #B6B6B6; } .phoneNumber .phoneNumberTxt { font-size: 14px; } #headerContact .cartOrder { text-align: right; border-right: 1px dashed #B6B6B6; } .cartOrder a { color: #B6B6B6; font-weight: 900; text-decoration: none; position: relative; top: 1px; } .cartOrder a:hover { color: black; } .cartOrder .orderTxt { font-weight: bold; text-transform: uppercase; font-size: 14px; } #headerContact .checkOut { text-align: left; } .checkOut a { color: #B6B6B6; font-weight: 900; margin-right: 8px; text-decoration: none; position: relative; top: 3px; } .checkOut a:hover { color: black; } /* == Logo ================================================================== */ #Logo { float: left; width: 300px; } #Logo img { display: block; margin: 22px 0 0 -5px; width: 93%; } /* == Search Form =========================================================== */ #SearchForm { padding: 0; position: absolute; right: 0; top: 68px; width: 335px; } #SearchForm #search_query { width: 277px; height: 24px; float: left; padding: 2px 0 2px 8px; } #SearchForm input.button { padding: 4px 16px; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/searcg_button.png?t=1518928208) 6px 3px no-repeat transparent; width: 45px; height: 30px; box-shadow: none; margin-left: 5px; } .QuickSearch { z-index: 9999; } .QuickSearchHover td{ background: #f4f4f4; } .QuickSearch a, .QuickSearch a:hover { color: #4D4C51; } /* == Primary Navigation ===================================================== */ /* Main Pages Menu change id to PrimaryMenu so as to not use bc's styling */ #PrimaryMenuOuter {} #PrimaryMenu { position: absolute; height: 30px; width: 655px; top: 102px; left: 269px; border-bottom: 3px dotted black; padding: 0 0 0 23px; } #PrimaryMenu > ul {} #PrimaryMenu > ul > li { float: left; } #PrimaryMenu > ul > li > a { display: block; padding: 4px 10px; font-size: 1.1em; text-decoration: none; color: black; font-weight: bold; } #PrimaryMenu > ul > li.ActivePage > a { } #PrimaryMenu > ul > li:hover > a { background: #5F5F5F; color: white; } /* sub menu code */ #PrimaryMenu ul li { position: relative; } #PrimaryMenu ul ul li { width: 100%; vertical-align: bottom; }/*fixes width and gap issues w/li's in ie7*/ #PrimaryMenu ul ul { display: block; width: 175px; position: absolute; top: -10000em; } #PrimaryMenu ul ul ul { left: 175px; } #PrimaryMenu li:hover { visibility: inherit; }/*fixes ie7 sticky bug*/ #PrimaryMenu ul > li:hover > ul { top: auto; z-index: 1000; } #PrimaryMenu ul ul > li:hover > ul { top: 0; z-index: 1000; } #PrimaryMenu li li a { display: block; padding: 5px 10px; background: #5F5F5F; color: white; text-decoration: none; } #PrimaryMenu li li a:hover { background: #00AEEF; } /* ============================================================================= Content -n- cnt ========================================================================== */ .Content h2, .TitleHeading { color: #5F5F5F; font-size: 24px; text-transform: uppercase; text-shadow: none; } /* ============================================================================= Sidebar -n- sdb ========================================================================== */ .Left, .Right { font-size: 1em; } .Left h2, .Right h2 { font-size: 1.5em; line-height: 1.2em; } #SideCategoryList { } #SideCategoryList > ul { float: left; border-top: none; margin-left: -10px; padding-bottom: 20px; } #SideCategoryList ul li { background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/bgtile.jpg?t=1518928208) top left repeat; width: 190px; padding: 9px 2px 2px 10px!important; margin: 10px 0 20px 0!important; border-bottom: none; min-height: 30px; font-weight: bold; overflow: hidden; } #SideCategoryList ul li a { color: white; font-size: 16px; min-height: 30px; max-height: 60px; float: left; } #SideCategoryList li ul { border-top: none!important; width: 190px; float: left; padding-left: 12px!important; background: #f5f6f6; margin-left: -10px; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y1ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiOGJhYzYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZjVmNmY2IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==); background: -moz-linear-gradient(top, #f5f6f6 0%, #b8bac6 100%, #f5f6f6 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f6f6), color-stop(100%,#b8bac6), color-stop(100%,#f5f6f6)); background: -webkit-linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); background: -o-linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); background: -ms-linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); background: linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 ); } #SideCategoryList li ul li { background: none; margin: 0 0 0 -12px!important; padding: 2px 0 0 0!important; float: left!important; min-height: 22px; height: 22px; width: 202px; } #SideCategoryList li ul li a { color: #606060; font-size: 14px; text-transform: none!important; margin-left: 16px; } #SideCategoryList li ul li:hover { background: #00AEEF; font-size: 14px; text-transform: none!important; margin-left: 8px; } #SideCategoryList li ul li:hover a { text-decoration: none; color: white; } #SideAccountMenu { background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/bgtile.jpg?t=1518928208) top left repeat; width: 190px; padding: 9px 2px 2px 10px!important; margin: 10px 0 20px 0!important; border-bottom: none; min-height: 55px; font-weight: bold; position: relative; clear: left; } #SideAccountMenu h2 { color: white; font-size: 18px; text-transform: uppercase; height: 30px; float: left; font-weight: bold; } #SideAccountMenu ul { border-top: none!important; width: 190px; float: left; padding-bottom: 20px; margin-left: -20px; margin-top: 10px; padding-left: 12px!important; background: #f5f6f6; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y1ZjZmNiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNiOGJhYzYiIHN0b3Atb3BhY2l0eT0iMSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZjVmNmY2IiBzdG9wLW9wYWNpdHk9IjEiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==); background: -moz-linear-gradient(top, #f5f6f6 0%, #b8bac6 100%, #f5f6f6 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#f5f6f6), color-stop(100%,#b8bac6), color-stop(100%,#f5f6f6)); background: -webkit-linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); background: -o-linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); background: -ms-linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); background: linear-gradient(top, #f5f6f6 0%,#b8bac6 100%,#f5f6f6 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f5f6f6', endColorstr='#f5f6f6',GradientType=0 ); } #SideAccountMenu li { background: none; margin: 0 0 0 -12px!important; padding: 2px 0 0 0!important; float: left!important; min-height: 22px; height: 22px; width: 202px; } #SideAccountMenu li a { color: #606060; font-size: 14px; text-transform: none!important; margin-left: 16px; } #SideAccountMenu li:hover { background: #01AEF0; font-size: 14px; text-transform: none!important; margin-left: 8px; } #SideAccountMenu li:hover a { text-decoration: none; color: white; } #sideSigns { width: 200px; margin: 10px 0 20px 0!important; position: relative; float: left; } #sideSigns .Sign { float: left; margin: 10px 0; width: 200px; } #sideSigns .Sign img { width: 200px; } #SideNewsletterBox p { margin: 0 0 6px 0; } #SideNewsletterBox p.bottom { margin-bottom: 0; } #SideNewsletterBox label { margin-bottom: 3px; } #SideNewsletterBox input { width: 162px; font-size: 1em; padding: 3px; margin: 10px 0 0; } #SideNewsletterBox .button { width: auto; height: auto; padding: 8px 16px; } #couponcode, #giftcertificatecode { padding: 5px; } /* ============================================================================= Footer -n- ftr ========================================================================== */ .aboveFooterBorder { width: 950px; position: relative; height: 1px; border-bottom: 3px dotted black; /* margin: 30px -290px; 15px auto;*/ margin: 30px auto !important; display: inline-block; } #Footer { font-size: 1em; width: 950px; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/bgtile.jpg?t=1518928208) repeat; padding-bottom: 70px; position: relative; overflow: hidden; } #Footer #FooterMenu { float: left; margin: 0; position: absolute; top: 5px; left: 20px; } #Footer #FooterMenu ul { background: -moz-linear-gradient(#FFFFFF, #808080); background: -ms-linear-gradient(#FFFFFF, #808080); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(100%, #808080)); background: -webkit-linear-gradient(#FFFFFF, #808080); background: -o-linear-gradient(#FFFFFF, #808080); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF", endColorstr="#808080"); -ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF", endColorstr="#808080")'; background: linear-gradient(#FFFFFF, #808080); float: left; list-style: none outside none; margin: 0; min-height: 250px; min-width: 150px; padding: 40px 10px 10px; text-align: left; } #Footer #FooterMenu ul li { float: none; position: relative; } #Footer #FooterMenu ul li a { padding: 0 12px; color: black; border: none; font-weight: bold; } #Footer #FooterMenu ul li.ActivePage a, #Footer #FooterMenu ul li:hover a { color: #09f; } #Footer #FooterMenu ul ul { display: none; } #Footer #FooterCompanyMenu { float: left; margin: 0; position: absolute; top: 5px; left: 220px; } #Footer #FooterCompanyMenu ul { background: -moz-linear-gradient(#FFFFFF, #808080); background: -ms-linear-gradient(#FFFFFF, #808080); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF), color-stop(100%, #808080)); background: -webkit-linear-gradient(#FFFFFF, #808080); background: -o-linear-gradient(#FFFFFF, #808080); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF", endColorstr="#808080"); -ms-filter: 'progid:DXImageTransform.Microsoft.gradient(startColorstr="#FFFFFF", endColorstr="#808080")'; background: linear-gradient(#FFFFFF, #808080); float: left; list-style: none outside none; margin: 0; min-height: 250px; min-width: 150px; padding: 40px 10px 10px; text-align: left; } #Footer #FooterCompanyMenu ul li { float: none; position: relative; } #Footer #FooterCompanyMenu ul li a { padding: 0 12px; color: black; border: none; font-weight: bold; } #Footer #FooterCompanyMenu ul li.ActivePage a, #Footer #FooterCompanyMenu ul li:hover a { color: #09f; } #Footer #FooterCompanyMenu ul ul { display: none; } #Footer #copyright { bottom: 20px; color: white; font-size: 12px; position: absolute; right: 10px; text-align: right; width: 300px; } #Footer #rightImages { float: right; margin: 20px 10px 0 0; } #rightImages img { float: right; margin-right: 5px; margin-bottom: 10px; } #rightImages .linkContainer { clear: right; } #rightImages .linkContainer .creditCards { height: 42px; min-width: 261px; float: right; width: auto; margin: 8px 0; } #rightImages .linkContainer .creditCards img { float: right; margin: 0 2px; height: 40px; } #rightImages .linkContainer .socialMedia { height: 42px; min-width: 80px; float: right; width: auto; margin-top: 9px; } #rightImages .linkContainer .socialMedia img { float: right; margin: 0 2px; height: 38px; } #addressContainer { position: absolute; top: 10px; left: 405px; color: #FFF; text-align: left; } #addressContainer h2 { color: #FFF; font-size: 18px; text-transform: uppercase; margin: 0; text-decoration: underline; } #addressContainer p { margin: 0; padding: 0; font-weight: bold; font-size: 16px; } #Footer #design-by { font-size: .8em; } /* ============================================================================= Miscelaneous -n- msc ========================================================================== */ .Breadcrumb { font-size: 12px; font-weight: bold; top: 10px; position: relative; border-bottom: 3px dotted rgba(0,0,0,0.1); } .Breadcrumb li { color: black; } .Breadcrumb li a { color: #5F5F5F; text-decoration: none; } .Breadcrumb li a:hover { color: black; text-decoration: none; } .Breadcrumb li:first-child { padding-left: 0; } .CustomWish.Breadcrumb li.last a { background: none; } .FeedLink { display: none; } /* ============================================================================= Pages -n- pgs ========================================================================== */ .blog .FeedItem h3 { margin-bottom: .5em; } .blog .FeedItem .FeedContent p { margin-bottom: .5em; } /* ============================================================================= Category -n- ctg ========================================================================== */ .SortBox { float: right; font-size: 1em; } .CatPagePrev { float: left; } .CatPageNext { float: right; } .SubCategoryList ul, .SubBrandList ul { margin-bottom: 0; padding-left: 0; } .SubCategoryList li:last-child, .SubBrandList li:last-child { margin-bottom: 0; } .CategoryPagination { height:22px; } #CategoryBreadcrumb { width: 490px; float: left; border-bottom: none!important; color: #606060; } #CategoryBreadcrumb li { color: black; font-size: 12px; font-weight: bold; } #CategoryBreadcrumb li a { color: #606060; font-size: 12px; text-decoration: none; } #CategoryBreadcrumb li a:hover { color: black; text-decoration: none; } .SortBox { float: right; margin: 8px 10px 0 0; } #CategoryHeading { float: left; } #CategoryHeading h2 { color: #5F5F5F; font-size: 45px; font-weight: bolder; left: 20px; position: absolute; text-shadow: 0 0 2px white; text-transform: none; top: 55px; } #CategoryHeading .CategoryDescription { position: relative; height: 130px; float: left; width: 718px; border: 1px solid #5F5F5F; overflow: hidden; } .SubCategoryList { background: none repeat scroll 0 0 white; border: 1px solid #5F5F5F; width: 710px; float: left; margin-top: 20px; } .SubCategoryList ul { padding-left: 0; float: left; width: 710px; } .SubCategoryList li { float: left; background: none; padding: 0; width: 160px; margin-left: 17px; } .SubCategoryList li a { color: black; text-decoration: none; border-bottom: 1px dotted rgba(51,51,51, 0.7); } .SubCategoryList li a:hover { color: black; text-decoration: none; border-bottom: 3px dotted rgba(185,0,0,1); } #CategoryContent { width: 710px; margin-top: 30px; float: left; } #CategoryContent li { border: none!important; width: 220px!important; padding: 0; margin: 10px 8px; height: 320px!important; } #CategoryContent li:hover { border: none!important; width: 220px; background: none!important; } #CategoryContent .ProductImage { width: 220px!important; height: 250px!important; overflow: hidden; } #CategoryContent .ProductDetails { text-align: center; height: auto!important; } #CategoryContent .ProductDetails a { color: black; font-size: 16px; } #CategoryContent .ProductPriceRating em { text-align: center; color: #606060; } /* ============================================================================= Product Lists -n- pls ========================================================================== */ .ProductList li .ProductCompareButton { text-align: left; } /* ============================================================================= Product -n- prd ========================================================================== */ .zoomPup { display: none!important; } #ProductDetails { width: 710px; } #ProductDetails .ProductMain { float: left; width: 410px; position: relative; } #ProductDetails .ProductMain h2 { color: black; font-size: 24px; font-weight: normal; padding: 0; margin: 0; } #ProductDetails .ProductMain .PriceRow { margin-top: -10px; } #ProductDetails .ProductMain .Value em { font-size: 24px; color: black; font-weight: bolder; margin: 0; padding: 0; } #ProductDetails .ProductMain .productAddToCartRight .button { width: 195px!important; background: #636363; height: 40px; padding: 10px auto; left: 0; box-shadow: none; font-weight: bold; font-size: 16px; } #ProductDetails .ProductMain .productAddToCartRight .button:hover { width: 195px!important; color: black; background: #a3a3a3; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2EzYTNhMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjcwJSIgc3RvcC1jb2xvcj0iI2QxZDFkMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2RiZGJkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YzdjN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #a3a3a3 0%, #d1d1d1 70%, #dbdbdb 80%, #7c7c7c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a3a3a3), color-stop(70%,#d1d1d1), color-stop(80%,#dbdbdb), color-stop(100%,#7c7c7c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* IE10+ */ background: linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3a3a3', endColorstr='#7c7c7c',GradientType=0 ); /* IE6-8 */ height: 40px; padding: 10px auto; left: 0; text-shadow: none; border: 2px solid #636363; } #ProductDetails .ProductMain #ProductInformation { background: none repeat scroll 0 0 #E2E2E2; margin-top: 20px; padding: 10px; width: 390px; padding-top: 50px; position: relative; } #ProductDetails .ProductMain #ProductInformation .ProductSKU { position: absolute; top: 10px; left: 10px; } .VariationProductSKU { font-weight: bold; } #ProductDetails .ProductMain .productAttributeValue { position: relative; left: 20px; } #ProductDetails .ProductMain .productAttributeValue select { width: 305px; } .ProductAddToCart input.Textbox, #CartEditProductFieldsForm input.Textbox { margin: 0 0 10px!important; } .productAttributeList .required { visibility: visible!important; } /* == Product Thumb ========================================================== */ #ProductDetails .ProductThumbWrap { float: left; width: 250px; margin: 0 25px; } #ProductDetails .ProductThumb { float: none; } #ProductDetails .ProductTinyImageList { } #ProductDetails .ProductTinyImageList li { border: none!important; } #ProductDetails .ProductTinyImageList li .TinyOuterDiv { border: none!important; } /* == Product Main ========================================================== */ #ProductDetails hr { display: none; } .AddThisButtonBox { width: auto!important; text-align: left!important; padding: 10px 0 0 0!important; } /* details grid */ .ProductDetailsGrid .Label, .productAttributeList .productAttributeLabel { width: auto!important; float: left; text-align: left; padding: 0!important; margin: 0 10px 0 0!important; } .ProductDetailsGrid .DetailRow { padding: 6px 0 0 0; margin-top: 0; } .productAttributeList .productAttributeRow { padding: 0!important; margin: 0!important; } .productAttributeList .productAttributeValue { display: inline; float: left;} .productAttributeList .required { color: red; } .ProductDetailsGrid .BulkDiscount { clear: both; padding-top: 15px; } /* product & search tabs */ #ProductTabs { float: left; width: 690px; margin-top: 0px; } .TabNav { float: left; margin: 0; padding: 0; border: none; position: relative; overflow: hidden; top: 1px; z-index: 2; border-bottom: none; } .TabNav li { float: left; margin: 0 10px 0 0; padding: 0; line-height: normal; min-width: 140px; text-align: left; } .TabNav li a { display: block; margin: 0; padding: 5px 10px 5px; border: none; top: 0; border: 1px solid #7E7E7E; color: white; background: #272822; font-weight: bold; font-size: 16px; } .TabNav li a:hover { background: #a3a3a3; /* Old browsers */ /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2EzYTNhMyIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjcwJSIgc3RvcC1jb2xvcj0iI2QxZDFkMSIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjgwJSIgc3RvcC1jb2xvcj0iI2RiZGJkYiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiM3YzdjN2MiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #a3a3a3 0%, #d1d1d1 70%, #dbdbdb 80%, #7c7c7c 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a3a3a3), color-stop(70%,#d1d1d1), color-stop(80%,#dbdbdb), color-stop(100%,#7c7c7c)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* IE10+ */ background: linear-gradient(top, #a3a3a3 0%,#d1d1d1 70%,#dbdbdb 80%,#7c7c7c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a3a3a3', endColorstr='#7c7c7c',GradientType=0 ); /* IE6-8 */ color: black; } .TabNav li.Active a { border-bottom: none; border-bottom: 1px solid transparent; background: #fff; padding: 5px 10px 5px; font-weight: normal; font-weight: bold; font-size: 16px; color: black; } #TabPanels { clear: both; border: 1px solid #7E7E7E; padding: 10px; margin-top: 0; background: #fff; overflow: hidden; position: relative; z-index: 1; width: 690px; } /* ============================================================================= Cart -n- crt ========================================================================== */ #CartHeader { overflow: hidden; } #CartHeader h2 { float: left; } #CartHeader span .button { margin-top: 7px; } /* ============================================================================= Checkout -n- chk ========================================================================== */ .ExpressCheckoutBlock .ExpressCheckoutTitle { background: #E0E0E0; border: 1px solid #ccc; } .ExpressCheckoutBlockCollapsed .ExpressCheckoutTitle { background: #F7F7F7; border: 1px solid #e5e5ef; color: #555; } .ExpressCheckoutBlockCompleted .ExpressCheckoutCompletedContent { color: #888; } #fastCartSuggestive { width: 710px; margin-top: 30px; float: left; } #fastCartSuggestive li { border: none!important; width: 220px!important; padding: 0; margin: 10px 8px; height: 320px!important; } #fastCartSuggestive li:hover { border: none!important; width: 220px; background: none!important; } #fastCartSuggestive .ProductImage { width: 220px!important; height: 250px!important; overflow: hidden; } #fastCartSuggestive .ProductImage img { max-width: 220px!important; } #fastCartSuggestive .ProductDetails { text-align: center; height: auto!important; } #fastCartSuggestive .ProductDetails a { color: black; font-size: 16px; } #fastCartSuggestive .ProductPriceRating em { text-align: center; color: #606060; } /* ============================================================================= Account -n- act ========================================================================== */ /* ============================================================================= Home Page -n- hpg ========================================================================== */ #cycle { border-bottom: 3px dotted black; height: 320px; width: 950px; } #cycle .cycleSlide { height: 300px; width: 950px; margin: 10px 0; } #threeCategories { width: 950px; height: 145px; margin-top: 10px; } #threeCategories div { height: 110px; width: 266px; float: left; } #threeCategories .catOne { margin-right: 76px; } #threeCategories .catTwo { margin-right: 76px; } #threeCategories .catBottomGravel { width: 950px; height: 35px; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/bgtile.jpg?t=1518928208) left top repeat transparent; } #threeSigns { width: 950px; height: 138px; margin-top: 20px; } #threeSigns div { height: 138px; width: 296px; float: left; } #threeSigns .signOne { margin-right: 30px; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/sign.png?t=1518928208) left top no-repeat transparent; } #threeSigns .signTwo { margin-right: 30px; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/sign.png?t=1518928208) center top no-repeat transparent; } #threeSigns .signThree { background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/images/sign.png?t=1518928208) right top no-repeat transparent; } #left-side{ width : 280px; float : left; } #aboutUs { float : right; width : 660px; min-height: 200px; margin-bottom: 15px; font-family: Georgia, "Times New Roman", Times, serif; } #aboutUs h2 { font-size: 20px; color: black; font-weight: bold; } #aboutUs p { width: 670px; font-size: 15px; } /* ============================================================================= Internet Explorer 7 -n- ie7 ========================================================================== */ /* IE7 browser-specific: *:first-child+html #example { display: none; } */ *:first-child+html #SearchForm input.button { margin-top: 0; } /* Clearfixes */ *:first-child+html .button { display: inline-block; } /* ============================================================================= Media Queries -n- mqs ========================================================================== */ /* Smartphones (portrait) and narrow browsers */ @media only screen and (max-width : 320px) { /* Styles */ } /* Smartphones (landscape) and narrow browsers */ @media only screen and (min-width : 321px) { /* Styles */ } @media only screen and (min-width: 600px) { /* Styles */ } @media only screen and (min-width: 800px) { /* Styles */ } /* Only Use the following device-width queries when you have to target only those specific devices. Otherwise use the generic min-width or max-width queries to cover all browsers and modern devices like tablets. This can be accomplised due to the following meta tag in HTMLHead.html notice width=device-width */ /* Smartphones (portrait and landscape) */ @media only screen and (min-device-width: 320px) and (max-device-width: 480px) { /* Styles */ } /* iPhone 4 specific ----------- */ @media only screen and (-webkit-min-device-pixel-ratio : 1.5), only screen and (min-device-pixel-ratio : 1.5) { /* Styles */ } /* iPads (portrait and landscape) ----------- */ @media only screen and (min-device-width : 768px) and (max-device-width : 1024px) { /* Styles */ } @media print { * { background: transparent !important; color: black !important; text-shadow: none !important; filter:none !important; -ms-filter: none !important; } a, a:visited { text-decoration: underline; } a[href]:after { content: " (" attr(href) ")"; } abbr[title]:after { content: " (" attr(title) ")"; } .ir a:after, a[href^="javascript:"]:after, a[href^="#"]:after { content: ""; } pre, blockquote { border: 1px solid #999; page-break-inside: avoid; } thead { display: table-header-group; } tr, img { page-break-inside: avoid; } img { max-width: 100% !important; } @page { margin: 0.5cm; } p, h2, h3 { orphans: 3; widows: 3; } h2, h3 { page-break-after: avoid; } } /* ============================================================================= Plugins -n- plg ========================================================================== */ /* Fancybox */ #fancybox-loading { position: fixed; top: 50%; left: 50%; width: 40px; height: 40px; margin-top: -20px; margin-left: -20px; cursor: pointer; overflow: hidden; z-index: 1104; display: none; } #fancybox-loading div { position: absolute; top: 0; left: 0; width: 40px; height: 480px; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208); } #fancybox-overlay { position: absolute; top: 0; left: 0; width: 100%; z-index: 1100; display: none; } #fancybox-tmp { padding: 0; margin: 0; border: 0; overflow: auto; display: none; } #fancybox-wrap { position: absolute; top: 0; left: 0; padding: 20px; z-index: 1101; outline: none; display: none; } #fancybox-outer { position: relative; width: 100%; height: 100%; background: #fff; } #fancybox-content { width: 0; height: 0; padding: 0; outline: none; position: relative; overflow: hidden; z-index: 1102; border: 0px solid #fff; } #fancybox-hide-sel-frame { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: transparent; z-index: 1101; } #fancybox-close { position: absolute; top: -15px; right: -15px; width: 30px; height: 30px; background: transparent url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208) -40px 0px; cursor: pointer; z-index: 1103; display: none; } #fancybox-error { color: #444; font: normal 12px/20px Arial; padding: 14px; margin: 0; } #fancybox-img { width: 100%; height: 100%; padding: 0; margin: 0; border: none; outline: none; line-height: 0; vertical-align: top; } #fancybox-frame { width: 100%; height: 100%; border: none; display: block; } #fancybox-left, #fancybox-right { position: absolute; bottom: 0px; height: 100%; width: 35%; cursor: pointer; outline: none; background: transparent url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/blank.gif?t=1518928208); z-index: 1102; display: none; } #fancybox-left:hover, #fancybox-right:hover { visibility: visible; } #fancybox-right:hover span { left: auto; right: 20px; } #fancybox-left:hover span { left: 20px } #fancybox-left { left: 0px } #fancybox-right { right: 0px } #fancybox-left-ico, #fancybox-right-ico { position: absolute; top: 50%; left: -9999px; width: 30px; height: 30px; margin-top: -15px; cursor: pointer; z-index: 1102; display: block; } #fancybox-left-ico { background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208); background-position: -40px -30px; } #fancybox-right-ico { background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208); background-position: -40px -60px; } .fancybox-bg { position: absolute; padding: 0; margin: 0; border: 0; width: 20px; height: 20px; z-index: 1001; } #fancybox-bg-n { top: -20px; left: 0; width: 100%; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox-x.png?t=1518928208); } #fancybox-bg-ne { top: -20px; right: -20px; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208); background-position: -40px -162px; } #fancybox-bg-e { top: 0; right: -20px; height: 100%; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox-y.png?t=1518928208); background-position: -20px 0px; } #fancybox-bg-se { bottom: -20px; right: -20px; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208); background-position: -40px -182px; } #fancybox-bg-s { bottom: -20px; left: 0; width: 100%; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox-x.png?t=1518928208); background-position: 0px -20px; } #fancybox-bg-sw { bottom: -20px; left: -20px; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208); background-position: -40px -142px; } #fancybox-bg-w { top: 0; left: -20px; height: 100%; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox-y.png?t=1518928208); } #fancybox-bg-nw { top: -20px; left: -20px; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208); background-position: -40px -122px; } #fancybox-title { font-size: 12px; z-index: 1102; } .fancybox-title-inside { padding-bottom: 10px; text-align: center; color: #333; background: #fff; position: relative; } .fancybox-title-outside { padding-top: 10px; color: #fff; } .fancybox-title-over { position: absolute; bottom: 0; left: 0; color: #fff; text-align: left; } #fancybox-title-over { padding: 10px; background-image: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancy_title_over.png?t=1518928208); display: block; } .fancybox-title-float { position: absolute; left: 0; bottom: -20px; height: 32px; } #fancybox-title-float-wrap { border: none; border-collapse: collapse; width: auto; } #fancybox-title-float-wrap td { border: none; white-space: nowrap; } #fancybox-title-float-left { padding: 0 0 0 15px; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208) -40px -90px no-repeat; } #fancybox-title-float-main { color: #fff; line-height: 29px; font-weight: bold; padding: 0 0 3px 0; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox-x.png?t=1518928208) 0px -40px; } #fancybox-title-float-right { padding: 0 0 0 15px; background: url(//cdn11.bigcommerce.com/s-f61d6/templates/__custom/img/fancybox/fancybox.png?t=1518928208) -55px -90px no-repeat; }