/* -------------------------------------------------- seaoftea.com PAGE STYLES Last revised 27 October 2009 -------------------------------------------------- Individual page styles Assign ID to and prepend to declarations */ /* -------------------------------------------------- HOME -------------------------------------------------- */ #home #container { background: #FFF url(../images/art/background-victorianwoman.gif) no-repeat bottom left; } #home #content p span { font-style: italic; } /* Slideshow gallery */ #home #slideshow { width: 100%; background: transparent; } #home #slideshow li { position: relative; background: transparent; } #home #slideshow li.main { width: 48em; /* px */ height: 20.2em; /* px */ float: left; margin: 0; background: transparent url(../images/utility/background_slideshow.gif) no-repeat center center; } #home #slideshow li.main #photodiv { height: 20em; margin-top: .1em; background-position: center center; } #home #slideshow li.main #photodiv img { display: block; margin: 0 auto; } #home #slideshow li.auxiliary { width: 10em; /* 295px */ float: left; margin: 0 0 1em; padding: 0 1em 1em; background: transparent url(../images/utility/background_slideshow_right.gif) no-repeat top right; } #home #slideshow li.auxiliary.last { margin-right: 0; border-right: none; background: none; } #home #slideshow li.auxiliary img { display: block; margin: 0 auto; } #home #slideshow li a.img { padding: 0; border-bottom: none; background: transparent; } /* Slideshow headings */ #home #slideshow li.auxiliary h3 { font-size: 12px; line-height: 2.3333; font-weight: normal; font-family: "Gill Sans", "Gill Sans MT", Verdana, Arial, sans-serif; text-align: center; text-transform: uppercase; letter-spacing: .1em; } #home #slideshow li.auxiliary h3:after { padding-left: .5em; content: url(../images/utility/background-leaf-sm.png); } #home #slideshow li.auxiliary h3 span { font-weight: bold; } /* Slideshow image fades */ #home #slideshow li img:hover { opacity: .5; -moz-opacity: .5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=33)"; filter:alpha(opacity=50); } #home #slideshow li img:active { opacity: 1; /* CSS3 property not widely supported */ -moz-opacity: 1; /* legacy Mozilla */ -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=100)"; /* IE 8 */ filter: alpha(opacity=100); /* Required for IE browsers */ } /* Slideshow swap box */ #home #swap { width: 44em; height: 17em; position: absolute; top: .1em; left: 0; padding: 1.5em 2em; background: transparent url(../images/utility/light/transparent-85.png); } /* Featured product */ #home #content .inset { width: 21em; padding: 0 1em 1em; background: #97C5E9; /* Signature light blue 50% */ } #home #content .inset img { width: 23em; height: auto; position: relative; left: -1em; } #home #content .inset h3 span { color: #FFF; /* White */ font-size: 12px; line-height: 2.3333; text-transform: uppercase; letter-spacing: .1em; display: block; } #home #content .inset h3 span:after { margin-left: .4375em; content: url(../images/utility/background-leaf-sm.png); } #home #content .inset img:hover { opacity: .5; /* CSS3 property not widely supported */ -moz-opacity: .5; /* Required for Mozilla browsers */ filter:alpha(opacity=50); /* Required for IE browsers */ } #home #content .inset img:active { opacity: 1; /* CSS3 property not widely supported */ -moz-opacity: 1; /* Required for Mozilla browsers */ filter:alpha(opacity=100); /* Required for IE browsers */ } #home #content .inset a { border-bottom-color: #B9D8EF; /* Signature light blue 33% -- improve contrast */ } #home #content .inset a:hover { background-color: #B9D8EF; /* Signature light blue 33% -- improve contrast */ } #home #content .inset a:active { background-color: #74B3E3; /* Signature light blue 67% -- improve contrast */ } /* -------------------------------------------------- PRODUCTS -------------------------------------------------- */ #products #container { background: #FFF url(../images/art/background-victorianwoman.gif) no-repeat bottom left; } /* Featured product */ #products #content .inset { width: 16em; padding: 0 1em 1em; background: #97C5E9; /* Signature light blue 50% */ } #products #content .inset img { width: 18em; height: auto; position: relative; left: -1em; } #products #content .inset h3 span { color: #FFF; /* White */ font-size: 12px; line-height: 2.3333; text-transform: uppercase; letter-spacing: .1em; display: block; } #products #content .inset h3 span:after { margin-left: .4375em; content: url(../images/utility/background-leaf-sm.png); } #products #content .inset a { border-bottom-color: #B9D8EF; /* Signature light blue 33% -- improve contrast */ } #products #content .inset a:hover { background-color: #B9D8EF; /* Signature light blue 33% -- improve contrast */ } #products #content .inset a:active { background-color: #74B3E3; /* Signature light blue 67% -- improve contrast */ } /* Gallery */ #products #content .gallery { clear: both; } #products #content .gallery h2 { color: #74B3E3; /* Signature light blue 67% */ font-size: 1em; text-align: center; text-transform: uppercase; letter-spacing: .1em; margin: 2em 0 0; padding: 1.75em 1em 5px; border: 1px solid #526681; /* Signature dark blue 75% */ border-bottom: none; background: transparent url(../images/utility/background-awning.gif) repeat-y; } #products #content .gallery li { float: left; display: inline; padding-right: .75em; } #products #content .gallery li.last { padding-right: 0; } #products #content .gallery li a { border-bottom: none; } #products #content .gallery li a:hover { background: none; } #products #content .gallery li img { width: 104px; /* 105px */ } #products #content .gallery li img:hover { opacity: .5; /* CSS3 property not widely supported */ -moz-opacity: .5; /* Required for Mozilla browsers */ filter:alpha(opacity=50); /* Required for IE browsers */ } #products #content .gallery li img:active { opacity: 1; /* CSS3 property not widely supported */ -moz-opacity: 1; /* Required for Mozilla browsers */ filter:alpha(opacity=100); /* Required for IE browsers */ } #products #content .gallery li p { font-style: italic; line-height: 1.5; text-align: center; width: 100px; } #products .column { clear: left; } #products .column.right { clear: none; } /* -------------------------------------------------- PRODUCT DETAIL -------------------------------------------------- */ #detail #banner #product-category { color: #0093D8; /* Signature light blue */ font: bold 1em/2 "Gill Sans", "Gill Sans MT", Verdana, Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; position: relative; top: 1em; left: 0; clear: left; } #detail #content #main { position: relative; margin-bottom: 2em; background: transparent; } #detail #content .inset { float: right; margin-left: 2em; margin-bottom: 1em; } #detail #main table td { padding-right: 2em; } #detail #main td span { font: 12px/2.3333 "Gill Sans", "Gill Sans MT", Verdanan, Arial, sans-serif; text-transform: uppercase; letter-spacing: .1em; } #detail #content .column { margin-bottom: 1em; } #detail #comments { position: relative; clear: both; margin-bottom: 2em; padding: 1em; background: #97C5E9; /* Signature light blue 50% */ } #detail #comments.reset { top: 0; } #detail #comments h3 { color: #FFF; /* White */ text-transform: uppercase; letter-spacing: .1em; margin: 0 0 1em; } #detail #comments h3:after { margin-left: .5em; content: url(../images/utility/background-leaf-sm.png); } #detail .entry { margin-bottom: 2em; } #detail #comments .entry { padding-bottom: 2em; border-bottom: .1em solid #FFF; /* White */ } #detail .entry.last { margin-bottom: 0 !important; padding-bottom: 0 !important; border-bottom: none !important; } #detail .posted { font-size: 12px; line-height: 2.3333; } #detail .posted span { font-style: italic; } /* -------------------------------------------------- NEWSLETTER -------------------------------------------------- */ #blog #content .entry { clear: both; margin-bottom: 2em; padding-bottom: 2em; border-bottom: .3em double #C0C0C0; /* DarkGray */ } #blog #content .entry.first p { font-size: 16px; line-height: 1.75; margin-bottom: .875em; } #blog #content .entry.first h2 + p:first-line, #blog #content .entry.first .inset + p:first-line { color: #808080; /* Gray */ font-weight: bold; } #blog #content .entry.last, #blog #content .entry.single { padding-bottom: none; border-bottom: none; } #blog #content .entry .date { font-size: 11px; line-height: 2.54545; text-transform: uppercase; letter-spacing: .1em; margin: 0; } #blog #content .entry .posted { clear: both; padding-top: 1em; background: transparent url(../images/utility/background-posted.gif) no-repeat top left; } #blog #content .entry .posted span { color: #013469; /* Signature dark blue */ font-weight: bold; font-size: 12px; text-transform: uppercase; letter-spacing: .1em; } /* -------------------------------------------------- FAQS -------------------------------------------------- */ /* -------------------------------------------------- ABOUT -------------------------------------------------- */ #about #container { background: #fff url(../images/art/background-cargo.gif) no-repeat bottom right; } #about #content p span { font-style: italic; } /* -------------------------------------------------- CONTACT -------------------------------------------------- */ #contact #container { background: #FFF url(../images/art/background-contact.gif) no-repeat bottom right; } /* Mail form */ #mail-form { padding: .5em 1em 1em; background: #97C5E9; /* Signature light blue 50% */ } #mail-form h4 { margin-bottom: 0; } #mail-form input.field { font-family: Verdana, sans-serif; width: 97%; } /* Address + hCard */ .vcard { margin: 0 auto .75em; } .vcard .org { font-weight: bold; } .vcard .tel span, .vcard .fax span, .vcard .email span:first-child { color: #013469; /* Signature dark blue */ font-weight: bold; font-family: "Gill Sans", "Gill Sans MT", Verdana, Arial, sans-serif; } .vcard .email { } .vcard .adr, .vcard .tel { } /* -------------------------------------------------- REFERRERS -------------------------------------------------- */ #referrers #content { width: 100%; } #referrers table { border: .1em solid #B0B8BA; /* Signature dark blue 33% */ } #referrers table th, #referrers table td { border-bottom: .1em solid #B0B8BA; /* Signature dark blue 33% */ } #referrers table th { color: #013469; /* Signature dark blue */ font-size: 12px; text-align: left; text-transform: uppercase; letter-spacing: .1em; padding: .14583em 1.1667em; border-right: .4em double #FFA280; /* OrangeRed 50% */ } #referrers table td { padding: .125em 1em; } #referrers table a { border-bottom-style: dotted !important; } /* -------------------------------------------------- SITE MAP -------------------------------------------------- */ #sitemap #content { height: auto; } #sitemap #sitemap_list { margin-top: 2em; padding-top: 1em; border-top: .3em double #C0C0C0; /* Silver */ } #sitemap #sitemap_list h2 { margin: .875em 0; } #sitemap #content ul li h3 { margin-bottom: 0; }