/* Remove the default margins, padding and borders that a browser might add to elements as it sees fit */ html, body, ul, ol, li, p, h1, h2, h3, h4, h5, h6, form, fieldset, a { margin: 0; padding: 0; border: 0; } html { margin: 0; /* Remove Margin from the main page */ } fieldset { padding: 10px; } #upperNav { height: 23px; margin: 0; padding: 0; position: relative; } #upperNav li, #uppderNav div {float: left; margin: 0; padding-right: 5px; list-style: none;font-family: Verdana, sans-serif; letter-spacing:-1px;} #upperNav li, #upperNav a, #uppderNav div {height: 23px; display: block; color: #665546;font-size:16px} #upperNav a:hover {color: #CD7A31;} div { -moz-box-sizing: border-box; box-sizing: border-box; -webkit-box-sizing: border-box; } div::-webkit-scrollbar { -webkit-appearance: none; width: 7px; } div::-webkit-scrollbar-thumb { border-radius: 4px; background-color: rgba(0,0,0,.5); -webkit-box-shadow: 0 0 1px rgba(255,255,255,.5); } div::-webkit-scrollbar-track { background-color: rgba(190,214,219,1); } p { margin-bottom: 1em; } psmall { margin-bottom: 1em; } ul, ol { padding-left: 5px; } body { -moz-box-sizing: border-box; box-sizing: border-box; -webkit-box-sizing: border-box; margin: 5px auto 10px auto; background-color: #FAFAFA; background-attachment: fixed; font-family: Verdana, Geneva, sans-serif; color: #4A3C31; /* This is needed for IE 6 */ } body a { color: #6f97c0; } body, td { font-size: 16px; line-height: 1.6; } textarea { font-family: Verdana, Geneva, sans-serif; } /* ************************************************** * Page topper, navigation buttons, and forms * ************************************************** Removed from div#PageTopper height: 40px; */ div#PageTopper { overflow: hidden; } div#PageMenu { height: 58px; background-color: #0f4278; color: #FFFFFF; width: 95%; position: relative; } div#PageMenu a { color: #FFFFFF; font-size:16px; font-weight: 600; letter-spacing: 2px; } div#PageMenu a:hover, .subMenu a:hover { color: #B2541A; } div#PageMenu ul { list-style-type: none; text-align: left; float: left; font-family: verdana; padding-top: 5px; } div#PageMenu li { height: 20px; width: 125px; } div#BottomLinks a { color: #0f4278; font-size: 12px; padding-left: 6px; padding-top: 0; padding-bottom: 0; line-height: 2.0; } div#BottomLinks { position:relative; left: 0; bottom: 0; width: 100%; background-color:#ffffff; height: auto; } .current { background-color: #857363; } .subMenu { display: none; } .NavPlain { font-weight: normal; font-size: 13px; } .NavCurrent { font-size: 13px; font-weight: bold; text-decoration: underline; color: #64A0C8; } .subMenu ul{ width: 349px; height: 105px; background-color: #857363; } .divider { border-bottom: 1px solid #665546; width: 100px; } div#PageMenu .subMenu ul li { height: 20px; } div#PrintLogo, div#mobileMenu { display: none; } .lastItem { border-bottom: none; } div#BedImage a, div#BedImage img { display: block; margin: 0 auto; width: 166px; height: 125px; border: 0; } div#BedImageContainer { position: relative; left: 5px; text-align: center; } div#BedImageRollover { text-align: center; width: 600px; padding: 4px; background-color: #fff; border: 1px dashed blue; } div#BedImage p#Side1NameSmall, div#BedImage p#Side2NameSmall { margin: 0; width: 180px; text-align: left; font-weight: bold; }h1 div#BedImage p#Side1NameSmall { position: absolute; bottom: 20px; left: 50px; } div#BedImage p#Side2NameSmall { position: absolute; bottom: 5px; left: 135px; } div#BedImageRollover p#Side1NameMedium, div#BedImageRollover p#Side2NameMedium { text-align: left; font-weight: bold; font-size: 1.2em; } div#BedImageRollover p#Side1NameMedium { position: relative; top: 165px; right: 305px; } div#BedImageRollover p#Side2NameMedium { position: relative; top: 170px; right: 185px; } div#ContentBorder { background-color: #FFF; width: 100%; margin-top: 50px; } div#TopNav { width: 100%; height: 70px; } div#TopNav ul { margin: 0; padding: 0; text-align: center; } div#TopNav li { list-style-type: none; padding: 0; display: inline; } div#TopNav ul li a span { display: none; } div#TopNav ul li a { float: left; background-image: url('/inav/topnav0909.png'); background-repeat: no-repeat; } a#TopNavHome { margin: 3px 0 0 15px; width: 31px; height: 60px; background-position: -6px -7px; } a#TopNavLatex { margin: 8px 0 0 25px; width: 39px; height: 60px; background-position: -62px -12px; } a#TopNavMemoryFoam { margin: 0 0 0 18px; width: 44px; height: 60px; background-position: -119px -4px; } div#PageContentMattress { background-image:url(/inav/90NightBlue90.gif); background-position: 95px 0; background-repeat: no-repeat; } a#TopNavAdjustableBed { margin: 5px 0 0 15px; width: 50px; height: 60px; background-position: -178px -9px; } a#TopNavLinens { margin: 2px 0 0 11px; width: 41px; height: 60px; background-position: -308px -6px; } a#TopNavFirmnessAdvise { margin: 0 0 0 9px; width: 50px; height: 63px; background-position: -358px -4px; } a#TopNavHotDeals { margin: 11px 0 0 15px; width: 44px; height: 60px; background-position: -421px -15px; } a#TopNavMyAccount { margin: 0 0 0 14px; width: 57px; height: 60px; background-position: -479px -4px; } a#TopNavShipmentTracking { margin: 17px 0 0 11px; width: 50px; height: 60px; background-position: -547px -21px; } a#TopNavCart { margin: 1px 0 0 10px; width: 50px; height: 60px; background-position: -607px -5px; } a#TopNavDirectorySearch { margin: 16px 0 0 11px; width: 46px; height: 60px; background-position: -668px -20px; } div#NavFormsTest { height: 50px; background-color: #ffffff; background-repeat: repeat-x; } div#NavFormsTest div { height: 50px; padding-top: 5px; } div#NavFormsTest div input { vertical-align: top; } div#NavForms { height: 30px; background-color: #ffffff; background-image: url(/images/navBG_plaid_coolr.gif); background-repeat: repeat-x; } div#NavForms div { height: 24px; padding-top: 5px; } div#Chat { width: 150px; float: right; } div#SavedCartsForm { width: 165px; float: left; } h1 { font-family:Verdana, sans-serif; font-size: 2em; color: #0f4278; margin: 0 0 0.25em 0; line-height: 2em; } h3 { font-family:Verdana, sans-serif; font-size: 1.2em; color: #0f4278; margin: 0 0 0.25em 0; } form { display: inline; } #PageContent { overflow: none; width: 100%; position: relative; text-align: left; font-family: Verdana, Geneva, sans-serif; min-height: 0; } div#Footer { background-color: #0f4278; width: 100%; position: relative; left: 2px; padding: 5px; } div#Footer a { font-size: 1.4em; color: #ffffff; padding: 10px; } div#Footer h3 { font-size: 1.3em; } div#Footer p { margin: 0; } p.Price, p.SalePrice, .Special { font-weight:normal; } p.SalePrice, .Special { clear: both; } .Sale, .SalePrice, .Special { color: #B2541A; } span.Required { font-weight: bold; } .ErrorBox, .InfoBox { display: block; padding: 5px; width: 25em; max-width: 960px; font-size: 1.2em; font-weight: bold; text-align: center; margin: 1em auto; } .ErrorBox { border: 1px solid #f00; background-color: #fff; } .InfoBox { border: 1px solid #000; background-color: #ff9; } a#FirmnessAdvisor img { border: none; top: 5px; } div#NavForms div input { vertical-align: top } div#MakeBedForm { width: 315px; float: left; } div#SavedCartsForm { width: 165px; float: left; } div#SearchForm { width: 270px; float: right; } div#SearchForm input, div#SearchForm select { float: left; } div#SavedCartsForm a { float: left; margin-left: 10px; } .GoMakeBed, .GoSearch { cursor: pointer; background-position: center; background-repeat: no-repeat; /* This part hides the original button. */ background-color: transparent; border: 0; padding: 0; } .GoMakeBed { background-image: url(/images/button-gomakebed.gif); width: 109px; height: 40px; max-width: 109px; max-height: 40px; position: relative; bottom: 17px; } .GoSearch { background-image: url(/images/button-gosearch.gif); width: 104px; height: 25px; max-width: 104px; max-height: 25px; position: relative; bottom: 2px; } .GoMakeBed span, .GoSearch span { display: none; } div#NavForms .selectfields { background-color: #cc9; font-size: 10px; color: #262831; margin: 0 3px 0 5px; padding: 0; border: 2px inset #ccc; } div#NavForms .SavedCarts { background-color: #FFFF99; font-size: 10px; color: #2A69A0; margin: 0 3px 0 0; padding: 0; border: 2px inset #CCCCCC; width: 95px; float: right; } div#NavForms .textfields { color: #000000; background-color: #FFFFCC; font-size: 10px; margin: 0; } .style2 { font-size: 11px } .SmallText { font-size: 0.9em; } h1w { font-family:Verdana, sans-serif; font-size: 2em; font-weight: 150; color: #fff; margin: 0 0 0.25em 0; } h2 { font-size: 1.8em; font-weight: 100; color: #0f4278; margin: 0; line-height: 1.8 } h2w { font-size: 2.4em; font-weight: fff; color: #0f4278; margin: 0; } h2.MattressName { font-size: 1.4em; font-weight: 100; color: #0f4278; margin: 0; } h3 { margin: 0; } h4.ProductName { font-weight: normal; padding: 0; margin: 0; color: #000066; height: 3em; } form { display: inline; } div#Footer h3 { font-size: 1.3em; } div#Footer p { margin: 0; } a#MonthlyDrawing { font-weight: bold; } a:link { text-decoration: none; color: #0f4278; } a:visited { color: #0066cc; text-decoration: none; } a:hover { color: #0f4278; } div#Footerhr { background-image: url(/otherimages/night_day.gif); width: 575px; height: 16px; margin: 10px auto 10px auto; } div#Footerhr hr { display: none; } .minilinks { font-size: 10px; } a:active { text-decoration: underline; color: #FF3300; } #iconblock { background-color: #FFFFCC; border-top: 3px double #366688; border-right: 1px solid #436884; border-bottom: 3px double #324D63; border-left: 1px solid #436884; background-image: url(/images/bg_softYellow.jpg); background-repeat: repeat; } #iconblock img { padding: 2px; background-color: #FFFFFF; border-top: 1px ridge #88AAC9; border-right: 2px ridge #88AAC9; border-bottom: 2px ridge #88AAC9; border-left: 1px ridge #88AAC9; } .Invisible { visibility: hidden; } div.Submit { margin-top: 1em; } input.SubmitButton { float: none; } ul#ErrorList, ul.ErrorList { text-align: left; color: red; } .Error { font-weight: bold; color: red; } table.Firmness { text-align: center; vertical-align: middle; } p.Price { clear: both; display: inline; } p.SalePrice { display: inline; padding-left: 4px; } p.SalePrice { margin: 0; } div#NoResults { background-color: #ffff99; padding: 5px; width: 20em; max-width: 860px; font-size: 1.2em; font-weight: bold; border-width: 1px; border-color: black; border-style: solid; text-align: center; margin: 0 auto 0 auto; } a.TestRestLink img { border: 0; } div.Clear { clear: both; } hr { height: 1px; width: 95%; color: #000; background-color: #000; border: 0; } .InfoBox { display: block; background-color: #ffff99; padding: 5px; width: 25em; max-width: 860px; font-size: 1.2em; font-weight: bold; border: 1px solid #000; text-align: center; margin: 1em auto; } div#PopupContent { width: 100%; border: 1px solid #000; background-color: #fff; margin: 0.75em auto; padding: 0.75em; } div#CustFeedback { width: 26em; margin: 0 auto; padding: 0.5em; clear: both; border: 0 solid #ffff90; background-color: white; text-align: center; } div#CustFeedback form p { text-align: left; margin: 0 auto 1em auto; } div#CustFeedback form p.Submit { margin: 1em auto 0 auto; text-align: center; } div#CustFeedback textarea { width: 90%; height: 5em; } div#NowLoadingFloat { z-index: 99999; position: fixed; top: 50%; left: 50%; margin-left: -16px; margin-top: -16px; display: none; } a#FirmnessAdvisor { display: block; background-color: #f7e88f; border: 1px dashed #999666; width: 50%; margin: 1em auto 1em auto; } a#FirmnessAdvisor span { font-size: 1.2em; font-weight: bold; } a#FirmnessAdvisor span.Block { display: block; margin: 1em 0; } a#FirmnessAdvisor img { border: none; } .singleBox { float: left; width: 250px; position: relative; } .singleBoxSmall { float: left; width: 185px; position: relative; } .QuarterBox { float: left; width: 235px; position: relative; } .singleBoxSmall img{ display: block; margin-left: auto; margin-right: auto; } .doubleBox { float:left; width: 48%; position: relative; } .singleBoxBig { float: left; width: 350px; position: relative; } .singleBoxTall { float: left; width: 250px; position: relative; height: 400px; } .doubleBoxSmall { float: left; width: 481px; position: relative; } .tripleBox { clear: both; width: 751px; position: relative; } .quadrupleBox { margin-left: 15px; margin-right: 10px; clear: both; width: 100%; position: relative; } .hDivide { float: left; width: 6px; height: 315px; background-image: url('/inav/hbox.png'); } .hDivideTall { float: left; width: 6px; height: 400px; background-image: url('/inav/hbox.png'); } .hDivideSmall { float: left; width: 6px; height: 215px; background-image: url('/inav/hbox.png'); } .hDivideMini { display: block; float: left; width: 6px; height: 115px; background-image: url('/inav/hbox.png'); } .hNullDivide { float: left; width: 6px; height: 20px; } .vDivide { width: 747px; height: 6px; clear: both; background-image: url('/inav/vbox.png'); background-repeat: no-repeat; margin-top: 10px; } .vDivideLong { width: 100%; height: 6px; clear: both; background-image: url('/inav/vbox.png'); background-repeat: repeat-x; margin-top: 10px; } .vNullDivide { width: 747px; height: 6px; clear: both; margin-top: 10px; } .headerBox { width: 110%; height: 186px; clear: both; background: url('/inav/newskin/aboutUsHeader.jpg'); } .tripleBox img, .doubleBox img, .singleBox img, .doubleBoxSmall img, .singleBoxBig img { display: block; } .homeTextBox { font-family:Verdana, sans-serif; font-size:1em; color: #0f4278; padding: 5px; } .boxPage, .quadrupleBox, .boxBackground, .tripleBox, .doubleBox, .singleBox, .doubleBoxSmall, .singleBoxBig, .singleBoxSmall { display: inline-block; padding: 10px; padding-bottom: 0; font-size: 1em; color: #003366; line-height: 1.7em; } .boxBackground { display: none; background: #6f97c0; -moz-opacity:.75; filter:alpha(opacity=75); opacity:.75; position: absolute; top: 0; left: 0; z-index: 1; } .headerBackground { display: none; width: 100%; height: 186px; background: #fff; -moz-opacity:.75; filter:alpha(opacity=75); opacity:.75; position: absolute; top: 0; left: 0; z-index: 1; } .headerContent { position: absolute; top: 0; left: 0; z-index: 2; font-size: 1em; padding: 14px; padding-bottom: 0; color: #4A3C31; width: 100%; } #BedPrice { font-size: 1em; } #priceDescription { font-size: 1em; } .boxPage { background-color: #6f97c0; position: relative; top: 2px; width: 100%; } .boxPageWhite { background-color: #ffffff; position: relative; top: 2px; width: 100%; line-height: 1.7em; padding: 5px 25px 5px 5px; } .bigBoxPage { background-color: #6f97c0; position: relative; top: 2px; width: 100%; } .mattressSelectorSide { float: left; width: 200px; margin-left: 10px; background: #fff; color: #4A3C31; } body select { background-color: #6f97c0; font-size: 1em; color: #fff; margin: 0 3px 0 5px; padding: 0; border: 2px inset #ccc; } #info { width: 90%; text-align:left; border:dashed; border-width:medium; border-color: #0f4278; margin: 0; padding: 10; font-size: 12px; color: #0f4278; top: 0; left: 0; } #footerNavCenter { margin: 0; padding: 10px; font-size:1em; position: relative; top: 0; text-align:center; float: none; } #footerNav1 { width: 265px; height: 150px; margin: 0; padding: 0; position: absolute; top: 0; left: 0; float: left; } #footerNav2 { width: 265px; height: 129px; margin: 0; padding: 0; position: absolute; top: 4px; left: 265px; float: left; } #footerNav3 { width: 245px; height: 129px; margin: 0; padding: 0; position: absolute; top: 0; left: 515px; float: left; } #footerNav4 { width: 250px; height: 129px; margin: 0; padding: 0; position: absolute; top: 0; left: 650px; float: left; } #footerNav1 li, #footerNav2 li,#footerNav3 li,#footerNav4 li {margin: 0; padding: 0; list-style: none;} #footerNav1 li, #footerNav1 a, #footerNav2 li, #footerNav2 a, #footerNav3 li, #footerNav3 a, #footerNav4 li, #footerNav4 a {height: 20px; display: block;} .navbar-header { display: none; } .cartImage { padding-left:15px; width: 255px; float:left } .cartName { width:360px; float:left; position: relative; } .cartUnitPrice { width:130px; float: left; } .cartQuantity { width:75px; float:left; } .cartPrice { width:100px; float: right; text-align: right; padding-right: 12px; font-size:14px; } .cartItem { border-bottom: 2px solid #6f97c0; } .groupBottom { position: relative; padding-left: 5px; width: 100%; text-align: right; background-color:#6f97c0; } .stretchWrap { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; align-items: stretch; -webkit-flex-wrap: nowrap; flex-wrap: nowrap } .groupContainer { margin:5px; width: 98%; border: 2px solid #A7E9F9; } #OrderCommentsContainer { width: 435px;float: left;padding-left: 22px;float: left; } #TotalPriceInfo { width:332px; float: right; padding-right: 30px; } .ZipInfo { width: 180px; float: left; padding-left: 11px; } #whyDoWeAsk { font-size: 1em; float: right; padding: 0; right: 50px; top: 50px } .centerWrap {display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;align-items: center; -webkit-align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; -webkit-justify-content: space-between; } /*==========================css from header ====================================================================================================*/ .PhoneHeader { position: absolute; top: 0; right: 20px;} #MediumDescription {max-width: 600px;} img.forDesktop {display: none} .forMobile {display: none} .forMobileBig {display: none} .desktopOnly {display: block} #MenuMobile a {font-size: 14px} #MenuMobile {display: none; top: 0; right: 0;} #MenuMobileButton {display: none;position: absolute; top: 0; right: 0;background: #0f4278;border:1px solid black;border-radius:5px;} #testimonial {width: 170px;position: relative; left: 12px;top: 40px; text-align: left;} .Center { margin-left: auto; margin-right: auto; text-align: center } #DavesWord {right: 3px !important;} .stretchWrap {display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;align-items: stretch; -webkit-align-items: stretch; -webkit-flex-wrap: nowrap; flex-wrap: nowrap; justify-content: space-between; -webkit-justify-content: space-between; } .centerWrap {display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;align-items: center; -webkit-align-items: center; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; -webkit-justify-content: space-between; } #CallUs {top: 70px; bottom: 120px !important;max-height: 100px;} #Blue {top: 0 !important} #footerNav1,#footerNav2,#footerNav3,#footerNav4 {z-index: 2;position: relative; top: 0; right: 0; left: 0; bottom: 0; height: auto; width: auto;padding-bottom: 10px;padding-left: 10px;} div {border: 0;} div#Footer a {padding: 0} div.topSpace {position: relative;} div.flexBox{ display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; -webkit-justify-content: space-between; } .hiddenMobile {display: block} div.flexBox img{vertical-align:top;} div.flexBottom {align-items: flex-end; -webkit-align-items: flex-end; position: relative; top: -80px; margin-bottom: -80px} html {overflow-x: hidden} .TriProduct, .hiddenProduct{width: auto; max-width: 33%;min-width: 250px;border: 0 solid red; float:left; margin-left: auto; margin-right: auto;font-size:1em;} .hidden, .ProductTitle { display: none !important} .hiddenDesktop {display: none !important} @media only screen and (max-width: 900px){ #mainHeaderBg {width: 100%;} .hiddenProduct {display: none;} .forMobileBig {display: block;} .ProductTitle { width: 100%; border: 1px solid grey;display: block; padding: 5px; text-align: center} #SkipThisStep {top: 0 !important;} div.flexBottom {top: 0;margin-bottom: 0;} #ImageGalleryTitle, #ProductCompare, #PinIt, #ProductImage, #ProductVideo, #ImageGallery, #TestimonialDiv, #ProductDetailHeader {left: 0 !important; top: 0 !important; width: auto !important;} .PhoneHeader {text-align: right; font-size: 12px;} .PhoneHeader img {position: relative;} #MenuMobile {display: block} #nav {display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;} ul#nav { height: auto; } ul#nav > li { float: left; width: 100%; min-width:50px; white-space: nowrap; text-align:center} ul#nav a { line-height: 10px; } ul#nav ul { position: relative;min-width:200px; } #PageMenu,#UpperMenu, #SaleMessage, #CallUs, #BottomLinks,#Slide , #Slide2 , #WhoInBed , #DavesWord , #BigFooterButtons { display: none} .headerContent {position: relative} .headerBox {min-height: 100px;height:auto;} div#PageContent, #PageContent { left: 0 !important; width: 100%; max-width: 100%; margin-left: auto; margin-right: auto !important;} div#PageTopper, div#ContentBorder {width: 100%;max-width: 776px; margin-left: auto; margin-right: auto;} div#navigation, div#Text { margin-left: auto; margin-right: auto;position: relative} .MainMenuClass {border-left: 0;} .boxPage {max-width: 100%;} .tripleBox, .headerContent, .headerBox, #PageContent,.boxPage { width: auto; margin-left: auto; margin-right: auto;} .tripleBox:after, .headerContent:after, .headerBox:after, #PageContent:after, .boxPage:after { clear: both;} img {max-width: 100%;} #AddThis, .hDivide, .vDivide {display: none} #PageContent{padding-bottom: 50px;} #MenuMobile {width: 100%;z-index:100; top: 0; left: 0;} .quadrupleBox, .boxBackground, .tripleBox, .singleBox, .doubleBoxSmall, .singleBoxBig, .singleBoxSmall { width:95% !important;} div#Fieldsets {display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;-webkit-flex-wrap: wrap; flex-wrap: wrap;width:100%} img.hideSmall, div.hideSmall {display: none} #PageContent {display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap} .smallAdjust, #Features, #Specifications, #testimonialBox {position: static !important; width:100% !important} #testimonialBox {height: auto !important} #WhoInBed {position: relative !important; top: -186px !important; left: -2px !important;} .stretchWrap { display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex;align-items: stretch; -webkit-align-items: stretch; -webkit-flex-wrap: wrap; flex-wrap: wrap;justify-content:space-around;-webkit-justify-content:space-around; } .topSpace { padding-top: -50px;} ul#nav { background: #0f4278; width: 100%; } h2 { font-size: 1.6em; font-weight: 80; color: #0f4278; margin: 0; } ul#nav > li { float: left; position: relative; } ul#nav ul { background: #6f97c0; display: none; position: absolute; left: 0; top: 100%; } ul#nav a { cursor: pointer; display: block; color: white; line-height: 25px; padding: 0 3px; } ul#nav li { list-style: none; } ul#nav li:hover { background: #44697d; } ul#nav li:hover ul { display: block; z-index:99 } .cartImage { padding-left:15px;width: 25%;float:left;min-width: 166px} .cartName { max-width:40%;float:left;position: relative;} .cartUnitPrice {width:10%;float: left;} .cartQuantity {width:10%;float:left;} .cartPrice {width:10%;float: right;text-align: right;padding-right: 6px;} .changeItems { display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap;min-width:200px;white-space: nowrap; } .groupBottom { width: auto;} .bigBoxPage { width: 100%; } .menuContainer, .cartItem { display: -webkit-box; display: -moz-box;display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between;-webkit-justify-content: space-between;} .groupContainer { width: auto;} .hDivideMini, #bedMap { display: block; } .vNullDivide, .vDivideLong {display: none; } .changeItems { width: 200px; } div#PageContent { padding-bottom: 50px;} textarea, .groupBottom, #PageContent {width: 100% !important;} #OrderCommentsContainer { width: auto; margin: 5px !important; } #TotalPriceInfo {float: right; padding-right: 30px; } .ZipInfo {float: right; width: auto; padding-right: 22px; } #whyDoWeAsk { float: none; top: 0; left: 0;} .quadrupleBox { width: auto } div#CartSummary {float: none; margin-left: auto; margin-right: auto;} div#BedImageThumb, div#BedImageThumbReview { } .ProductInfo { width: auto; } .ProductFeatures { width: auto !important; } #testimonial {width: auto;position: relative; left: 0;top: 0; padding: 5px;} .forDesktop {display: none;} .forMobile {display: none;} .forMobileBig {display: block;} .body {padding-top: 50px;} } @media only screen and (max-width: 600px){ div#PageTopper {top: 1px;margin-bottom: 1px;} .PhoneHeader {padding-top: 0; } #nav {-webkit-flex-wrap: wrap; flex-wrap: wrap;} ul#nav > li { width:50px; margin-left: auto; margin-right: auto} .cartImage { display: none;} div { border: 0 solid red } img.hideMini { display: block} .forMobileBig {display: none} img.forDesktop {display: none} .desktopOnly {display: none} .hiddenDesktop {display: block !important} .forMobile {display: block} .hiddenMobile {display: none !important} h2 { font-size: 1.4em; font-weight: 60; color: #0f4278; margin: 0; } #hideShowNav { display:none} .body select { background-color: #6f97c0; font-size: 1em; color: #fff; margin: 0 3px 0 5px; padding: 0; border: 2px inset #ccc; } } .clearfix::after { content: ""; clear: both; display: table; } /*====================================================flexbox css===============================================*/ .container { display: flex; /* or inline-flex */ flex-direction: row; flex-wrap: wrap; justify-content: center; } .parent { display: flex; height: 300px; /* Or whatever */ } .child { width: 100px; /* Or whatever */ height: 100px; /* Or whatever */ margin: auto; /* Magic! */ } /* Large */ .navigation { display: flex; flex-flow: row wrap; /* This aligns items to the end line on main-axis */ justify-content: flex-end; } /* Medium screens */ @media all and (max-width: 900px) { .navigation { /* When on medium sized screens, we center it by evenly distributing empty space around items */ justify-content: space-around; } } /* Small screens */ @media all and (max-width: 600px) { .navigation { /* On small screens, we are no longer using row direction but column */ flex-direction: column; } } .flex-container { padding: 0; margin: 0; list-style: none; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around; } .flex-item { background: white; padding: 5px; width: 206px; height: auto; margin-top: 1px; margin-bottom: 10px; margin-right: 5px; line-height: 0; color: white; font-weight: bold; font-size: 3em; text-align: center; } /*@import "compass/css3";*/ .wrapper { display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap; font-weight: bold; text-align: center; } .wrapper > * { padding: 10px; flex: 1 100%; } .header { background: blue ; } .footer { background: lightgreen; } .main { text-align: left; background: deepskyblue; } .aside-1 { background: gold; } .aside-2 { background: hotpink; } @media all and (min-width: 900px) { .main { flex: 3 0; } .aside-1 { order: 1; } .main { order: 2; } .aside-2 { order: 3; } .footer { order: 4; } } .video-container { position:relative; padding-bottom:56.25%; padding-top:30px; height:0; overflow:hidden; } .video-container iframe, .video-container object, .video-container embed { position:absolute; top:0; left:0; width:100%; height:100%; } @media print { .no-print, .no-print * { display: none !important; } } #myDIV1 { width: 80%; padding: 10px; text-align: left; background-color: #f7e88f; margin-top:10px; position: relative; top: 10px; left: 0; } #myDIV2 { width: 80%; padding: 10px; text-align: left; background-color: #f7e88f; margin-top:10px; position: relative; top: 10px; left: 0; } .buttonx { position:absolute; bottom:-5px; right:0; } @media all and (max-width: 600px) { .aside { flex: 1 auto; } #myDIV1 { width: 95%; padding: 10px; text-align: left; background-color: #f7e88f; margin-top:10px; position: absolute; top: 5px; left: 0; } #myDIV2 { width: 95%; padding: 10px; text-align: left; background-color: #f7e88f; margin-top:10px; position: absolute; top: 5px; left: 0; } } /*-------this is what moves the navigation left right etc --------*/ .mainHeaderNavigation{ position:fixed; right: 310px; top: 30px; z-index: 1001; font-size: 14px; white-space: nowrap } /* Specific to mobile phones */ .mobileHeaderBackground{ position: fixed; top: 0; left: 0; background-color: #0f4278; width: 100%; height: 58px; z-index: 24; } @media only screen and (max-width: 900px) { .mainHeaderNavigation{ position:fixed; right: 0; top: 37px; z-index: 1001; font-size: .85em; white-space: nowrap } .desktopOnly {display: none} /* .forMobileBig {display: none} */ } @media screen and (max-width: 900px) { div#ContentBorder { margin-top: 0 !important; } .mobileHeaderBackground{ z-index: 999; } } @media screen and (max-width: 600px) { .PhoneHeader { top: 5px; right: 15px; } .mainHeaderNavigation { left: 0; top: 5px; width:50px; } .mobileHeaderBackground { height: 38px; } .underMenu { top: 38px; padding-bottom: 0; margin-bottom: 30px; } body { padding-top: 38px; } #logoDiv { padding-left: 50px !important; } .float{ display: inline-block; } .sidenav {font-size: 18px;} .underMenu img { max-width: 80%; height: auto;} .underMenuItem{ width:100%; font-size: 14px; text-align: left; padding-left: 0; padding-bottom: 15px; } .closebtn { font-size: 24px !important; } #sideNavOverlay { display: none; } } .NoPrint, div#NowLoadingFloat, div#mobileMenu, div#CallUs, div#LiveHelp, div#HowToChoose, div#HeaderMenu, div#CustFeedback, .DontPrint , div#PageMenu, div#PageTopper, div#CopyRight, div#Footer, div#BigFooterButtons, div#FooterEmail, div#SideLinks{ display: none; } body { margin: 0 auto; } div#PrintLogo { display: inline; } div#ContentBorder { border: 0; } .hDivide { background-image: none ;}