/* CSS Document */ /*RESET ------*/ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, form, fieldset, legend, input, textarea, p, blockquote, th, td, button { margin: 0; padding: 0; } table { width: 100%; } fieldset, img, a img { border: 0; } caption, th { text-align:left; } q:before, q:after { content:''; } input, textarea, select { font-family:inherit; font-size: inherit; font-weight: inherit; } button { border: none; background: none; cursor: pointer; } .clearer { clear:both; height: 0; } .hide { display: none; visibility: hidden; } hr { display: none; clear: both; margin: 0; padding: 0; height: 0; overflow: hidden; visibility: hidden; } /*TYPOGRAPHY ------------*/ body { font-family: Arial, Helvetica, sans-serif;; font-size: 0.75em; text-align: center; } h1 { font-family: "Times New Roman", Times, serif; font-size: 2.55em; font-style: italic; } h2 { font-size: 2em; } h3 { font-size: 2em; } h4 { font-size: 1.5em; } h5 { font-size: 1.5em; } p, ul, ol { margin: 0 0 1em 0; line-height: 1.6em; } li { margin-left: 15px; } /*Navigation*/ ul#navigation { font-size: 1.09em; font-family: "Times New Roman", Times, serif; text-align: center; } ul#navigation li a { text-transform: uppercase; font-weight: bold; text-decoration: none; } ul#navigation li ul li a { text-transform:none; text-transform:capitalize; font-style: italic; font-weight: normal; } /*Title*/ #title p { font-family: "Times New Roman", Times, serif; font-size: 2.55em; font-style: italic; display: inline; margin-right: 10px; } #title h1 { display: inline; font-weight: normal; } body#checkout #title p.total { font-size: 1.6em; padding-top: 10px; } /*Checkout*/ table { font-size: 1.27em; } table a.remove { font-family: "Times New Roman", Times, serif; text-transform: capitalize; font-style: italic; text-decoration: none; } /*GENERIC FORMS*/ body#checkout fieldset label { text-align: right; font-family: "Times New Roman", Times, serif; font-style: italic; font-size: 1.3em; } button { font-family: "Times New Roman", Times, serif; font-style: italic; font-size: 1.4em; } div#feedback-message p { margin: 0; } div#feedback-message p a { text-decoration: underline; } /*Gallery Pagination*/ #gallery-pagination p, #gallery-pagination h1 { margin: 0; display: inline; font-family: "Times New Roman", Times, serif; font-size: 2.55em; font-style: italic; font-weight: normal; } #gallery-navigation a, #add-to-cart a { font-family: "Times New Roman", Times, serif; text-transform: capitalize; font-style: italic; text-decoration: none; } /*Price*/ #price { font-family: "Times New Roman", Times, serif; text-transform: capitalize; margin: 0; font-size: 1.3em; font-style: italic; padding-top:4px; } /*FOOTER*/ #footer p#website-host { white-space: nowrap; text-align: center; } #footer p#website-host a { white-space: nowrap; } /*STRUCTURE -----------*/ /*GLOBAL*/ div#container { width: 980px; min-height: 550px; margin: 0 auto; text-align: left; overflow: hidden; position: relative; padding-bottom: 40px; } /*HEADER*/ div#header { float: left; width: 120px; padding: 30px 10px; } /*Navigation*/ ul#navigation, ul#navigation ul { line-height: normal; margin: 0; } ul#navigation li { list-style: none !important; _overflow: hidden; _height: 1%; margin: 0; padding: 0; } ul#navigation li a { display: block; padding: 15px 0; border-bottom-width: 1px; border-bottom-style: solid; } ul#navigation li.active a#mm-about, ul#navigation li.active a#mm-gallery, ul#navigation li.active a#mm-links { border: none; } ul#navigation li.active ul { border-bottom-width: 1px; border-bottom-style: solid; } ul#navigation li ul li a { padding: 10px 0; border: none; } /*CONTENT*/ div#title { margin: 35px 0 0 160px; _margin-left: 140px; display: block; border-bottom-width: 1px; border-bottom-style: solid; } div#title h1 { padding: 0px 0px 25px 0; margin: 0px 0px 20px 0; } div#main-content { float: right; width: 520px; padding-top: 20px; position: relative; margin: 0 0 20px 0; } div#text-content { float: left; width: 280px; position: relative; margin: 0 0 20px 20px; } /*GENERIC FORMS*/ fieldset { margin: 0px 0px 10px; } fieldset label { display: block; } fieldset input, fieldset textarea { margin: 0px 0px 10px; width: 200px; padding: 5px; } button { display: block; float: right; margin: 0 7px 0 0; cursor: pointer; } button { width: auto; overflow: visible; padding: 5px 7px 5px 4px; /* IE6 */ } button[type]{ padding: 5px 7px 5px 3px; /* Firefox */ line-height: 17px; /* Safari */ } *:first-child+html button[type]{ padding: 5px 7px 5px 4px; /* IE7 */ } div#feedback-message p { margin: 0; } div#feedback-message p a { padding: 2px 7px 0px; border-bottom: 0px; margin: 0px 0px 7px; display: block; } /*LINKS*/ body#text div#main-content { float: right; width: 820px; padding-top: 20px; position: relative; margin: 0 0 20px 0; } /*GALLERY STYLES*/ #gallery-container { opacity: 0; } body#gallery div#main-content, body#text div#main-content.gallery { float: left; width: 620px; padding: 40px 0 70px 0; margin: 0 0 0 20px; display: block; } body#text div#main-content.gallery { float: right; padding-top: 20px; width: 515px; } body#gallery div#text-content { float: right; width: 165px; margin: 40px 0 20px 0; } body#gallery div#text-content #description { overflow-y: auto; padding: 0 15px 0 0; height: 520px; } body#text div#text-content { float: left; width: 255px; margin: 20px 0 20px 20px; height: 520px; overflow-y: auto; padding-right: 15px; } body#gallery #title { border: 0; margin-bottom: 0; } /*Image Holder*/ div.image { height: 433px; padding: 5px; display: block; margin-bottom: 5px; position: relative; text-align: center; opacity: 0; filter: alpha(opacity = 0); } div.image a { margin: 0; padding: 0; border: 0; } div.image a img { padding: 5px; } /*Preloader*/ div.image #preloader { position: absolute; top: 50%; left: 50%; margin: -10px 0 0 -10px; z-index: 9999; } /*Price*/ #price { position: absolute; top: 0; right: 110px; } body#text #price { display: none; } /*Add to Cart*/ #add-to-cart { position: absolute; top: 0; right: -25; width: 120px; display: block; } #add-to-cart #cart-preloader { float: right; opacity: 0; width: 20px; height: 20px; display: block; } #add-to-cart a { float: left; width: 80px; padding: 5px; text-align: center; } /*Total Images*/ #gallery-pagination { position: absolute; top: -10px; left: 0; padding: 0; margin: 0; } body#text #gallery-pagination { display: none; } /*Next & Previous Buttons*/ body#gallery #gallery-navigation { width: 620px; } body#text #gallery-navigation { width: 515px; } #gallery-navigation { position: absolute; bottom: 0; left: 0; height: 62px; border-top-width: 1px; border-top-style: solid; display: none; } #gallery-navigation a { display: block; padding: 5px; margin-top: 25px; } #gallery-navigation a#previous-image { float: left; } #gallery-navigation a#next-image { float: right; } /*Thumbnails*/ body#gallery div#image-thumbs { width: 470px; } body#text div#image-thumbs { width: 385px; } div#image-thumbs { position: absolute; height: 51px; bottom: 0; overflow: hidden; left: 72px; display: none; } div#image-thumbs-holder { display: block; white-space: nowrap; margin-left: 0px; height: 51px; position:relative; left:0; } div#image-thumbs a { display:inline-block; margin: 0; padding: 0; width: 51px; height: 51px; overflow: hidden; } div#image-thumbs a img { width: 45px; height: 45px; padding: 2px; display: block; } /*Login*/ body#login button{ float:left; } body#login div#main-content{ float:left; margin-left:100px; } body#login h1{ float:left; margin-left:100px; } /*CHECKOUT*/ body#checkout #title h1 { border: 0; padding: 0; margin: 0 0 0.56em 0; } body#checkout #main-content { padding: 20px 0 0 0; display: block; width: 820px; } body#checkout fieldset { float: left; width: 620px; } body#checkout .submit-checkout button{ margin-top:3px; } table { width: 620px; border-collapse: collapse; } table th { vertical-align:text-top; padding: 15px 5px; } table td { padding: 10px 5px; vertical-align:text-top; } table td img { width: 45px; height: 45px; margin: 0px 5px 0 0px; padding: 2px; vertical-align: middle; } table a.remove { margin-top: 10px; float: right; padding: 5px; display: block; border: 0; } table input.cart-quantity { width: 30px; padding: 5px; border: 0; text-align: center; } table a { padding: 0; margin: 0; } body#checkout fieldset.submit-checkout { float: right; width: 190px; padding-top: 45px; } /*cart page 2 form*/ body#checkout form#checkout-form { background: red; display: block; } body#checkout p.total { float: right; } body#checkout form#checkout-form fieldset { clear: both; width: 330px; } body#checkout fieldset label { width: 115px; margin-right: 10px; float: left; } body#checkout .submit-checkout-final{ width:333px; } fieldset textarea { margin-bottom: 10px; } /*CONTACT*/ body#contact #main-content { float: right; width: 580px; padding-top: 20px; margin-left: 20px; } body#contact div#supplementary-content { float: left; width: 205px; padding-top: 20px; margin: 0 0 20px 20px; } /*Lightbox*/ a#lightbox-loading-link, a#lightbox-loading-link:hover { border: 0; } /*FOOTER*/ div#footer { position: absolute; bottom: 0; left: 30px; } #footer p#website-host { margin: 0; padding: 0; } #footer p#website-host a { display: block; } /*COLOUR ---------*/ body { background: #ffffff; color: #000000; background-image:url(../../htmlbgImages/none); background-repeat: repeat-x;background-position: 0 0;} a { color: #000000; background-color: #FFFFFF; border-bottom-color: transparent; } a:hover { border-bottom-color: #000; } /*HEADER*/ div#header { background: #000000; -moz-box-shadow: 3px 3px 3px #FFFFFF; -webkit-box-shadow: 3px 3px 3px #FFFFFF; } /*Navigation*/ ul#navigation li a { color: #000000; border-bottom-color: #FFFFFF; background: none; } ul#navigation li.active ul { border-bottom-color: #FFFFFF; } ul#navigation li a:hover { color: #000000; } ul#navigation li.active a#mm-home, ul#navigation li.active a#mm-about, ul#navigation li.active a#mm-gallery, ul#navigation li.active a#mm-checkout, ul#navigation li.active a#mm-links, ul#navigation li.active a#mm-contact { color: #000000; } /*Title*/ div#title { border-bottom-color: #FFFFFF; } div#title h1 { color: #000000; } /*GALLERY*/ div.image a img { background: #FFF; -moz-box-shadow: 0 1px 3px 3px #FFFFFF; -webkit-box-shadow: 0 1px 3px 3px #FFFFFF; } #price { color: #000000; } #add-to-cart a { background-color: #FFFFFF; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#FFFFFF)); background: -moz-linear-gradient(top, #FFFFFF, #FFFFFF); _background: #FFFFFF; color: #000000; -moz-box-shadow: 0 1px 1px 1px #FFFFFF; -webkit-box-shadow: 0 1px 1px 1px #FFFFFF; } #gallery-pagination p, #gallery-pagination h1 { color: #000000; } #gallery-navigation { border-top-color: #000000; } #gallery-navigation a { background-color: #FFFFFF; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#FFFFFF)); background: -moz-linear-gradient(top, #FFFFFF, #FFFFFF); _background: #FFFFFF; color: #000000; -moz-box-shadow: 0 1px 1px 1px #FFFFFF; -webkit-box-shadow: 0 1px 1px 1px #FFFFFF; } div#image-thumbs a img { background: #FFF; -moz-box-shadow: 0 1px 1px 1px #FFFFFF; -webkit-box-shadow: 0 1px 1px 1px #FFFFFF; } div.thumb-holder{ width:55px; float:left; } /*GENERIC FORMS*/ fieldset input, fieldset textarea { background-color: #ffffff; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#FFFFFF)); background: -moz-linear-gradient(top, #ffffff, #FFFFFF); _background: #ffffff; color: #000000; border: 0; -moz-box-shadow: 0 1px 1px 1px #ffffff; -webkit-box-shadow: 0 1px 1px 1px #ffffff; } fieldset input:focus, fieldset textarea:focus { background-color: #ffffff; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#ffffff), to(#FFFFFF)); background: -moz-linear-gradient(top, #ffffff, #FFFFFF); _background: #ffffff; color: #000000; border: 0; -moz-box-shadow: 0 1px 1px 1px #ffffff; -webkit-box-shadow: 0 1px 1px 1px #ffffff; } fieldset button{ background-color: #FFFFFF; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#FFFFFF)); background: -moz-linear-gradient(top, #FFFFFF, #FFFFFF); _background: #FFFFFF; color: #000000; -moz-box-shadow: 0 1px 1px 1px #FFFFFF; -webkit-box-shadow: 0 1px 1px 1px #FFFFFF; } div#feedback-message p a { background-color: #ffff00; color: #000; } /*Checkout*/ table tr td { background-color: #FFFFFF; } table tr.odd td { background-color: #e2e2e2; } table tfoot td { border: none; } table td a, table td a:hover { color: #000000; background: none; border: 0; } table td img { background: #FFF; -moz-box-shadow: 0 0 2px 1px #000000; -webkit-box-shadow: 0 0 2px 1px #000000; } table a.remove, table a.remove:hover { background-color: #FFFFFF; background-image: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFFFFF), to(#FFFFFF)); background: -moz-linear-gradient(top, #FFFFFF, #FFFFFF); _background: #FFFFFF; color: #000000; -moz-box-shadow: 0 1px 1px 1px #000000; -webkit-box-shadow: 0 1px 1px 1px #000000; } /*FOOTER*/ div#footer { border-top-color: #000; }