/* These are the css classes for the css layouts used from Version 6.2. To use this file, upload to your store root and add a line like this to the section or copy and paste the classes into your existing css file. You will also need the following in vsadmin/includes.asp usecsslayout=TRUE or in vsadmin/includes.php $usecsslayout=TRUE; A help page is available here http://www.ecommercetemplates.com/help/css-layouts.asp This is just a sample file and can be edited to match your current design and layout. -------------------------------------*/ /* The product page -------------------------------------*/ @import url("//hello.myfonts.net/count/2b724d"); @font-face { font-family: 'quickpenw00-regularregular'; src: url('https://houseofallure.com.au/webfonts/quickpenw00-regular-webfont.eot'); src: url('https://houseofallure.com.au/webfonts/quickpenw00-regular-webfont.eot?#iefix') format('embedded-opentype'), url('https://houseofallure.com.au/webfonts/quickpenw00-regular-webfont.woff2') format('woff2'), url('https://houseofallure.com.au/webfonts/quickpenw00-regular-webfont.woff') format('woff'), url('https://houseofallure.com.au/webfonts/quickpenw00-regular-webfont.ttf') format('truetype'), url('https://houseofallure.com.au/webfonts/quickpenw00-regular-webfont.svg#quickpenw00-regularregular') format('svg'); font-weight: normal; font-style: normal; } @font-face {font-family: 'Hiatus';src: url('https://houseofallure.com.au/wp-content/themes/briefed/webfonts/2B724D_0_0.eot');src: url('/wp-content/themes/briefed/webfonts/2B724D_0_0.eot?#iefix') format('embedded-opentype'),url('https://houseofallure.com.au/wp-content/themes/briefed/webfonts/2B724D_0_0.woff') format('woff'),url('https://houseofallure.com.au/wp-content/themes/briefed/webfonts/2B724D_0_0.ttf') format('truetype');} /* The ECT Courasel start -------------------------------------*/ .nbs-flexisel-inner { overflow: hidden; float: left; width: 100%; border: 1px solid #000!important; border-radius: 0px !important; -moz-border-radius: 0px !important; -webkit-border-radius: 0px !important; } .nbs-flexisel-item img { width: 100%; cursor: pointer; positon: relative; max-width: 220px!important; max-height: 220px!important; margin-top: 10px; margin-bottom: 10px; } /* The ECT Courasel end -------------------------------------*/ /* The ECT Dynamic side menu start -------------------------------------*/ li.ectsubmenu1 :hover,li.ectmenu1 :hover {color:#8b8b83;} /* The ECT Dynamic side menu end -------------------------------------*/ /* The login in account start -------------------------------------*/ div.logintoaccount{ width:130px !important; } div.createaccount{ width:120px !important; float:left !important; } input.logintoaccount, input.createaccount, input.forgotpassword{ display:inline-block; font-family: 'montserrat', sans-serif; text-transform: uppercase; letter-spacing: 3px; padding: 5px; text-decoration:none; cursor:pointer; border: 1px solid #000; margin-bottom:10px; } /* The login in account end -------------------------------------*/ /* The search form start -------------------------------------*/ #text-16 input[type="text"] {width:100%;} /* The search form end -------------------------------------*/ td, th { border-bottom: 0px solid !important; padding: 0em !important; } TABLE.cobtbl{ background-color: #333; } TD.cobhl{ background-color: #ffffff; } TD.cobll{ background-color: #FFF; } td.cobhdr{ font-family: 'montserrat', sans-serif; text-transform: uppercase; font-size: 0.85em; letter-spacing: 3px; } /* ask a question lightbox start -------------------------------------*/ table.emftbl{ background-color:#333; font-size: 12px; width:0%; } td.emfll{ padding:25px !important; } td.emfhl{ background-color:#ffffff; color : #000; padding-top:20px; padding-top:10px; text-align:center; font-size: 12px; font-family: 'montserrat', sans-serif; text-transform: uppercase; letter-spacing: 3px; adding-left: 10px; padding-top: 25px; } /* ask a question lightbox end -------------------------------------*/ .addtocart :hover {opacity:0.3;} .configbutton :hover {opacity:0.3;} td.cobhl{ } td.cobll{ } input.buybutton{ border:none; } div.prodfilter{ float:left; background-color:#ececec; border: 1px dotted #42619a; padding:6px; font-weight:bold; color: #42619a; margin-bottom:10px; margin-top:10px; } div.prodfilterbar{ float:left; width:720px; } select.prodfilter{ width:158px !important; } input.sidefilter{ width:158px !important; } input.sidefiltergo { width:153px !important; } div.products{ } div.product{ width: 252px; height:410px; float:left; margin:2px; border:none; } div.imagenavigator{ font-size: 12px; text-align:center; padding:.4em; } div.prodnavigation { float: left; width: 75%; font-size: 0.85em; } div.checkoutbutton { float: left; width: 25%; } div.allproddiscounts{ font-size: 13px; color:#567CBB; width:500px; margin-bottom:0px; float:left; } div.prodmanufacturer{ color:#666; padding:0px; font-weight:bold; display:none !important; } div.prodsku{ color:#666; padding:0px; } div.prodimage{ padding-top: 6px; padding-bottom: 5px; margin-bottom: 5px; text-align:center; } div.prodname{ padding: 0px; margin-top: -9px; font-size: 14px; font-weight: normal; text-align: center; float: left; width: 260px; } div.prodname a { color: #000000; text-decoration:none;} div.prodname a:hover { color: #e5e1d0; text-decoration:none !important;} div.prodrating{ padding-left:10px; } div.prodinstock{ padding:0px; color:#666; } div.proddescription{ color: #777; font-size: 11.5px; padding-top:5px; padding-bottom:0px; text-align:center; } div.prodoptions{ padding:0px; width:290px; float:left; border: 1px solid #ccc; } select.prodoption{ font-size:11px; width:150px; float:right; margin:0px; } span.prodoption{ font-size:11px; float:left; padding: 0px; } div.optiontext{ font-size: 0.85em; padding: 0px; font-weight:normal; width: 55%; float:left; margin-right: 2px; } div.option{ padding: 0px; } div.listprice{ padding: 4px; text-align:center; width:350px; float:left; } div.prodprice{ padding: 0px; font-size: 12px; font-weight:normal; text-align:center; float:left; width:260px; font-family: 'montserrat', sans-serif; text-transform: uppercase; } div.prodcurrency{ padding: 0px; text-align:center; float:left; width:350px; } div.addtocart{ text-align:center; padding-top:0px; float:left; width:100%; } .notifystock{ text-align:center; padding-top:0px; float:left; width:350px; } .configbutton{ text-align:center; margin-top:0px; } div.outofstock{ text-align:center; padding-top:0px; font-weight:bold; } .prodid { background: #567CBB; color:#fff; padding:0px; text-align:center; } div.multioptiontext{ width:180px; } div.pagenums{ text-align:center; float:left; padding:10px; } /* The detail page -------------------------------------*/ div.detailcustom1 { float: right; clear: right; width: 370px; text-align: center; margin-top: 8px; } div.detailcustom2, div.detailcustom3{ font-family: 'montserrat', sans-serif; text-transform: uppercase; font-size: 0.7em; color: #000; letter-spacing: 3px; background-color:#F1F1EF; padding-top: 10px; padding-bottom: 10px; text-align: center; clear: left; width: 48%; margin-bottom: 8px; } div.detailcustom2 :hover, div.detailcustom3 :hover{ color:#DDD; } div.detailimage{ float:left; width:50%; margin-top: 25px; } .detailid { color:#000; width:560px; padding-bottom:10px; display:none !important; } .detailmanufacturer{ float:right; width:44.5%; } .detailinstock{ float:right; width:44.5%; border-bottom:1px #ccc dotted; } .wf-loading h1 { font-family: 'Playfair Display' !important; visibility: hidden; }.wf-active h1 { visibility: visible; } .detailname h1 { clear: right; font-family: 'quickpenw00-regularregular', Playfair Display !important; color: #000000; width: 44.5%; margin: 25px 0 10px 10px; float: right; font-size: 22px; } .detaildiscounts{ color:#60A1DE; font-weight:bold; font-size:12px; float:right; width:44.5%; } span.detaildiscountsapply{ color:#60A1DE; font-weight:bold; } div.detaildescription { font-family: 'Playfair Display', serif; margin-top: 0px; float: right; overflow: auto; padding-top: 20px; padding-left: 0px; width: 44.5%; border-top: 1px solid #000; } .detaillistprice{ text-align:center; float:right; clear:right; width:44.5%; } div.detailprice { font-family: 'montserrat', sans-serif; text-transform: uppercase; font-size: 12px; font-weight: normal; text-align: center; float: right; clear: right; width: 44.5%; color: #000; margin-top:10px; padding-top: 8px; padding-bottom: 8px; border-bottom: 1px solid #000; border-top: 1px solid #000; } div.detailcurrency{ padding-top: 6px; font-size: 11px; text-align:center; float:right; width:44.5%; } .detailoptions{ float:right; width:44.5%; clear:right; padding: 10px 0px 0px 0px; } select.detailprodoption{ font-size:0.85em; float:right; width:146px; margin:0px; } .detailoptiontext{ padding: 6px; float:right; } span.detailoption{ } div.emailfriend{ font-size: 0.85em; padding-top: 5px; text-align:center; float:right; clear:right; width:44.5%; border-bottom: 1px solid #000; border-top: 1px solid #000; padding-bottom: 8px; padding-top: 8px; } .previousnext{ padding-top:2px; padding-bottom:2px; float:right; clear:right; width:44.5%; text-align:center; } div.detailquantity{ float:right; clear:right; width:44.5%; margin-top:8px; } div.detailquantitytext{ font-size:0.85em; margin:4px; text-align:center; float:left; width:190px; } div.detailquantityinput{ margin:4px; float:left; width:50px; text-align:left; } div.detailaddtocart,.detailoutofstock{ margin:4px; float:right; clear:right; width:44.5%; text-align:center; padding-top:10px; padding-bottom:10px; } .detailnotifystock{ text-align:center; padding-top:6px; float:right; width:44.5%; } div.review{ width:270px; font-size: 0.85em; } div.navdesc{ padding-top:10px; float:right; } p.cstitle{ float:right; width:44.5%; } .csproduct{ float:right; width:370px; } div.thumbnailimage{ margin: 5px; padding: 5px; width: 410px; } /* The category page -------------------------------------*/ div.category{ width:350px; float:left; padding:10px; margin:2px; border:none; background-color:#FFF; } div.catimage{ width:350px; float:left; } div.catdesc{ padding:4px; } div.catname{ color: #000000; font-size: 12px; font-family: 'montserrat', sans-serif; text-transform: uppercase; letter-spacing: 3px; } .catdiscounts, .allcatdiscounts{ padding-left:5px; font-weight:bold; color:#60A1DE; } .categorymessage{ padding-left:5px; font-weight:bold; } /* Mini Cart --------------------------------------*/ TD.mincart { background-color: #fff; float: left; padding-top: 1px; padding: 0em; border-bottom: none; font-size: 0.85em; } P.mincart { background-color:#fff; float:left; } .minicartcnt {padding-top:5px;} /* Soft Cart --------------------------------------*/ div.scprodsadded { padding: 3px; text-align: left; border-top: 1px solid #000 !important; border-bottom: 1px solid #000; } div.scdiv { background:#FFF; padding:20px !important; } input.sccheckout{ display:inline-block; color:#000; font-family: 'montserrat', sans-serif; text-transform: uppercase; letter-spacing: 3px; font-size:12px; padding: 5px; text-decoration:none; cursor:pointer; border: 1px solid #000; margin-bottom:10px; } div.scimage{ } div.scprodsadded, div.sccartitems{ background-color:#fff; } div.scprice{ border-top: 1px solid #000 !important; border-bottom: 1px solid #000; background-color:#fff !important; color:#000 !important; margin-top:6px; padding-left: 16px !important; } div.sccarttotal{ border-top:1px solid #000!important; border-bottom:1px solid #000; background:#fff !important; color:#000 !important; } div.scdiv.scart.scwrap { margin: 120px auto 0 auto; background: #FFF; width: 600px; padding: 10px; border-radius: 0px !important; box-shadow: 1px 1px 5px #333; } /* Cross Sell Widget --------------------------------------*/ .rcsprodname { text-align: center !important; font-size: 14px !important; } .rcsprodprice {font-family: montserrat !important;font-size: 12px !important;text-align: center !important;margin-top: -25px !important;} /* Product Filter Bar --------------------------------------*/ div.ectpat { text-align: left; font-size: 1em; } div.ectpattitle{ font-size:0.85em; } div.ectpat a{ color: #000; font-size: 0.85em; } select.sidefilter { width:100% !important; } div.moreattributes{ width:100px; background: rgba(194, 223, 223, 0.9) !important; color:#000; font-family: 'montserrat', sans-serif; text-transform: uppercase; letter-spacing: 3px; font-size:12px; padding:5px; border:1px solid #999 !important; } /* Checkout Page --------------------------------------*/ div.checkoutsteps{ text-align:center; padding-top:8px; padding-bottom:8px; margin-bottom:8px; color:#000; } .cartupdate :hover, .cartcontinue :hover{color:#8b8b83;} /* Responsive Design --------------------------------------*/ @media screen and (max-width: 1030px) { /* -----Product Start --------------------------------------*/ div.products{ margin-left:0px; } div.product{ width:32%; } div.prodname { width:100%; } div.prodprice { width:100%; } div.configbutton { width: 100%; display: inline-block; } /* -----Product Detail Start --------------------------------------*/ div.thumbnailimage.detailthumbnailimage {float:left; } div.detailname{ margin-left:0px; } div.detailimage{ width:50%; } div.detaildescription{width:47%;margin-right:0px;} div.detailprice{ width:47%; } div.detailquantity{ width:47%; float:right; } div.detailoptions{ float:right; width:47%; } div.addtocart .detailaddtocart{ width:47%; } div.emailfriend, div.detailcustom1{ width:47%; } } /* -----Product Detail End --------------------------------------*/ @media screen and (max-width: 800px) { div.products{ width:100%; margin-left:4%; } div.product{ width:30%; } div.prodnavigation{ } div.optiontext{ width:37% } } @media only screen and (max-width: 780px) { /* -----Product Start --------------------------------------*/ div.products{ width:100%; padding-left:4%; margin-top:4%; } div.prodnavigation { } div.product{ width:43%; } div.prodname { width:100%; } div.prodprice { width:100%; } div.addtocart { width:100%;} div.category{ width:90%; } .detailname h1, span.detaildiscountsapply, div.detaildescription{ width:65%; } span.detaildiscountsapply{ margin-left:44px; } div.detailimage, div.detailname h1, div.detaildescription{ width:100%; } div.detailoptions{ width:90%; } div.detailmultioptiontext{ width:45%; } div.prodnavigation { width:68%; } div.checkoutbutton{ width:22%; margin-top: 0px; } /* -----Product End --------------------------------------*/ /* -----Product Detail Start --------------------------------------*/ div.thumbnailimage.detailthumbnailimage {float:left; clear:both; ;margin:0px; } div.detailname{ width:100%; } div.detailimage{ width:80%; } div.detaildescription{ } div.detailprice{ width:100%; } div.detailquantity{ width:40%; float:left; } div.detailoptions{ float:right; width:47%; } div.addtocart .detailaddtocart{ width:100%; } div.emailfriend, div.detailcustom1, div.detailcustom2,div.detailcustom3{ width:100%; clear:both; } /* -----Product Detail End --------------------------------------*/ } @media screen and (max-width: 640px) { /* -----Product Detail Start --------------------------------------*/ div.detailcustom2{ width:100%; clear:both; } div.detailcustom3{ width:100%; clear:both; } } @media screen and (max-width: 500px) { div.product{ width:100%; margin-left:-20px; margin-right:0px; text-align:center; } div.prodnavigation{ width:99%; } div.checkoutbutton{ width:99%; margin-left:auto; margin-right:auto; text-align:center; } div.detailimage{ width:95%; } .detailname h1, span.detaildiscountsapply, div.detaildescription{ width:95%; } span.detaildiscountsapply{ margin-left:10px; } div.detailmultioptiontext{ width:95%; } div.category{ width:85%; } /* ~~ Remove left hand field on checkout ~~*/ .cobcol1{ display:none; } /* ~~ Modify additional info field on checkout ~~*/ textarea.addinfo{ width:150px; } } @media screen and (max-width: 360px) { } @media screen and (max-width: 320px) { div.product{ } }