"
陳沛鴻 Team fwt-shop-367791343 fwt
From 2014hs.igem.org
/* FWTShop by Adonis Ronquillo for Free Web Templates www.freewebtemplates.com / www.doni.us Images by Fotogrph http://fotogrph.com Released under the Creative Commons Attribution 3.0 License.
- /
* { margin: 0; padding: 0; }
body {
background: #e7e7e7 url(
) no-repeat top center;
color: #7d7d7d;
font-size: 13pt;
line-height: 1.75em;
text-align: justify;
margin: 0;
padding: 0;
}
body,input { font-family: 'Arvo', serif; }
a {
color: #ac1205;
text-decoration: none;
}
a:hover { text-decoration: underline; }
br.clear { clear: both; }
h1,h2,h3,h4 { font-weight: normal; }
h2 { font-size: 1.75em; }
h2,h3,h4 { color: #ac1205; font-family: 'Arvo', serif; margin-bottom: 1em; }
h3 { font-size: 1.25em; }
h4 { font-size: 1.05em; }
img.left { float: left; margin: 8px 20px 20px 0; }
img.top { margin: 8px 0 20px 0; }
p { margin-bottom: 1.5em; }
ul { margin-bottom: 1.5em; }
#wrapper { width: 980px; margin: 0 auto; }
/******************************************************************************************
- HEADER
- /
#header { position: relative; width: 980px; height: 248px; margin: 0; padding: 0; }
/******************************************************************************************
- LOGO
- /
#logo { position: absolute; top: 100px; left: 205px; }
#logo h1 a{ font-family: 'Arvo', serif; font-weight: 700; text-decoration: none; color: #f6abd6; letter-spacing: -5px; font-size: 1.75em; text-shadow: 1px 1px 2px #000;
}
#logo h1 a span { color: #bc1a07; opacity: 1.00; }
/******************************************************************************************
- SEARCH
- /
#search { position: absolute; right: 20px; top: 89px; }
#search .fwt-input { font-family: 'Arvo', serif; width: 250px; padding: 6px; background: none; border: none; }
#search .fwt-button { background: none; border: none; color: #FFF; font-family: 'Arvo', serif; text-transform: uppercase; padding: 10px 13px; cursor: pointer; }
/******************************************************************************************
- ACCOUNT MENU
- /
#accountnav { position: absolute; right: 20px; top: 130px; font-size: 14px; }
#accountnav ul { list-style: none; margin: 0; padding: 0; }
#accountnav li { display: inline-block; margin: 0 15px 0 0; }
#accountnav li a { color: #f6aad5; letter-spacing: -1px; } /******************************************************************************************
- MENU
- /
/* Level 1 */
#nav { font-family: 'Arvo', serif; height: 50px; line-height: 50px; position: absolute; bottom: 20px; right: 20px; z-index: 99; }
#nav a { color: #fff; text-decoration: none; text-transform: lowercase; }
#nav .current a { color: #fff;
}
#nav ul { list-style: none; padding: 0; margin: 0; }
#nav ul li { display: block; float: left; padding: 0 8px 0 8px; }
#nav #dropmenu { position: relative; }
#nav #dropmenu li { position: relative; }
.dropotron li.opener { border-right: solid 2px #FFFFFF;; }
.dropotron { width: 180px; padding: 10px; background: #f6aed6; color: #fff; list-style: none; }
.dropotron a { color: #fff; text-decoration: none; }
.dropotron li { padding: 5px 10px 5px 10px; margin: 5px 0 5px 0; }
.dropotron li:hover, .dropotron li.active { background: #bc1906; }
/******************************************************************************************
- PAGE
- /
#page { width: 940px; background: #FFF; margin: 0; padding: 20px; }
.buy { float: right; color: #fff; text-transform: lowercase; padding: 6px 10px; background: #f6abd6; border: none; border-radius: 10px; text-shadow: 1px 1px 1px #000; }
/******************************************************************************************
- PRODUCTS
- /
#products { width: 980px; background: #fff; margin: 0; padding: 0; }
#products ul { list-style: none; margin: 0; padding: 0; }
#products li { width: 300px; height: 300px; display: block; float: left; margin: 0 0 20px 20px; position: relative; padding: 0; }
#products span {
position: absolute;
width: 280px;
padding: 10px;
bottom: 0;
left: 0;
background: url(
);
color: #FFF;
}
#products .buy { float: right; color: #fff; text-transform: lowercase; padding: 3px 5px; background: #f6abd6; border: none; border-radius: 10px; text-shadow: 1px 1px 1px #000; font-size: 11px; } /******************************************************************************************
- FOOTER
- /
#footer {
width: 980px;
padding: 0 10px;
background: url(
) no-repeat bottom center;
height: 58px;
margin: 0 auto;
}
#copyright { margin: 40px auto; width: 980px; text-align: center; }
/***************************************************************************** / SliderTron
- /
- slidertron
{ width: 940px; position: relative; }
- slidertron .navigation
{ position: absolute; display: block; z-index: 100; color: #ffffff; top: 315px; right: 0px; margin: 10px; padding: 10px; background-color: #303030; opacity: 0.75; }
- slidertron .navigation a
{ color: #ffffff; text-decoration: none; outline: none; }
- slidertron .viewer
{ width: 940px; height: 425px; }
- slidertron .viewer .reel .slide
{ position: relative; width: 940px; height: 425px; }
- slidertron .viewer .reel .slide span
{
position: absolute;
display: block;
width: 900px;
opacity: 0.90;
padding: 20px;
background: url();
color: #ffffff;
bottom: 0px;
left: 0px;
}
- slidertron .indicator
{ margin: 20px 0 0 0; width: 940px; height: 25px; text-align: center; }
- slidertron .indicator ul
{ list-style: none; padding: 0; }
#slidertron .indicator ul li { display: inline-block; background: #d0d0d0; color: #303030; width: 10px; height: 10px; margin: 0 10px 0 0; text-indent: -9999px; border-radius: 10px; }
#slidertron .indicator ul li.active { background: #9ec64e; color: #d0d0d0; }
