Template:Team:NCTU Formosa/css

From 2012.igem.org

(Difference between revisions)
m
 
(6 intermediate revisions not shown)
Line 1: Line 1:
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
+
<html>
-
<html xmlns="http://www.w3.org/1999/xhtml">
+
<head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
Line 214: Line 213:
.author {
.author {
display:none;
display:none;
 +
}
 +
/*
 +
---Calvin Hue
 +
*/
 +
 +
#cover-wrapper, #abstract-wrapper, #news-wrapper {
 +
background:url(https://static.igem.org/mediawiki/2012/8/84/Px.png) transparent repeat;
 +
-moz-box-shadow:4px 4px 8px 2px rgba(20%,20%,40%,0.5);
 +
-webkit-box-shadow:4px 4px 8px 2px rgba(20%,20%,40%,0.5);
 +
box-shadow:4px 4px 8px 2px rgba(20%,20%,40%,0.5);
 +
margin-bottom: 15px;
 +
border-radius: 3px;
 +
-webkit-border-radius: 3px;
 +
-moz-border-radius: 3px;
 +
}
 +
#cover-wrapper {
 +
height: 340px;
 +
}
 +
#cover {
 +
padding-top:15px;
 +
}
 +
#abstract-wrapper {
 +
width: 49%;
 +
min-height:250px;
 +
float: left;
 +
}
 +
#news-wrapper {
 +
width: 49%;
 +
min-height:250px;
 +
float: right;
 +
}
 +
#abstract-title {
 +
width: 307px;
 +
height: 30px;
 +
background:url(https://static.igem.org/mediawiki/2012/3/31/Subtitle-abstract.png) transparent no-repeat;
 +
}
 +
#abstract-title span {
 +
display: none;
 +
}
 +
#abstract p, #news p {
 +
margin:10px;
 +
}
 +
#news-title {
 +
width: 307px;
 +
weight: 30px;
 +
background:url(https://static.igem.org/mediawiki/2012/7/75/Subtitle-news.png) transparent no-repeat;
 +
}
 +
#news-title span {
 +
display: none;
 +
}
 +
 +
/* slider */
 +
/* http://www.menucool.com */
 +
 +
#sliderFrame {position:relative;width:970px;margin: 0 auto;} /*remove the
 +
 +
"margin:0 auto;" if you want to align the whole slider to the left side*/
 +
       
 +
#slider {
 +
    width:970px;height:290px;/* Make it the same size as your images */
 +
background:#fff url(loading.gif) no-repeat 50% 50%;
 +
position:relative;
 +
margin:0 auto;/*make the image slider center-aligned */
 +
}
 +
#slider img {
 +
position:absolute;
 +
border:none;
 +
display:none;
 +
}
 +
 +
/* the link style (if an image is wrapped in a link) */
 +
#slider a.imgLink {
 +
z-index:2;
 +
display:none;position:absolute;
 +
top:0px;left:0px;border:0;padding:0;margin:0;
 +
width:100%;height:100%;
 +
}
 +
 +
/* Caption styles */
 +
div.mc-caption-bg, div.mc-caption-bg2 {
 +
position:absolute;
 +
width:100%;
 +
height:auto;
 +
padding:0;
 +
left:0px; /*if the caption needs to be aligned from right, specify
 +
 +
by right instead of left. i.e. right:20px;*/
 +
bottom:0px;/*if the caption needs to be aligned from top, specify
 +
 +
by top instead of bottom. i.e. top:150px;*/
 +
z-index:3;
 +
overflow:hidden;
 +
font-size: 0;
 +
}
 +
div.mc-caption-bg {
 +
background-color:black;
 +
}
 +
div.mc-caption {
 +
font: bold 14px/20px Arial;
 +
color:#EEE;
 +
z-index:4;
 +
padding:10px 0;/*Adding a padding-left or padding-right here will
 +
 +
make the caption area wider than its background. Sometimes you may need to
 +
 +
define its width again here to keep it the same width as its background
 +
 +
area (div.mc-caption-bg).*/
 +
text-align:center;
 +
}
 +
div.mc-caption a {
 +
color:#FB0;
 +
}
 +
div.mc-caption a:hover {
 +
color:#DA0;
 +
}
 +
 +
 +
/* ------ built-in navigation bullets wrapper ------*/
 +
div.navBulletsWrapper  {
 +
top:300px; left:405px; /* Its position is relative to the #slider
 +
 +
*/
 +
width:150px;
 +
background:none;
 +
padding-left:20px;
 +
position:relative;
 +
z-index:5;
 +
cursor:pointer;
 +
}
 +
 +
/* each bullet */
 +
div.navBulletsWrapper div
 +
{
 +
    width:11px; height:11px;
 +
    background:transparent url(bullet.png) no-repeat 0 0;
 +
    float:left;overflow:hidden;vertical-align:middle;cursor:pointer;
 +
    margin-right:11px;/* distance between each bullet*/
 +
    _position:relative;/*IE6 hack*/
 +
}
 +
 +
div.navBulletsWrapper div.active {background-position:0 -11px;}
 +
 +
 +
/* --------- Others ------- */
 +
#slider
 +
{
 +
transform: translate3d(0,0,0);
 +
    -ms-transform:translate3d(0,0,0);
 +
    -moz-transform:translate3d(0,0,0);
 +
    -o-transform:translate3d(0,0,0);
}
}
#p-logo {
#p-logo {
Line 223: Line 373:
#top-section {
#top-section {
-
display: none;
+
height: 17px;
-
height: 30px;
+
background:url(https://static.igem.org/mediawiki/2012/8/84/Px.png) transparent repeat;
width: 100%;
width: 100%;
-
        background: none repeat scroll 0 0 #1C140D;
+
border:0px;
-
border-bottom: 1px solid #262B35;
+
-
border-left: medium none;
+
-
border-right: medium none;
+
}
}
#menubar {
#menubar {
-
top: 2px;
+
top: 0px;
-
font-family: 'Droid Sans', sans-serif;
+
font:11px Helvetica, Arial, Sans-serif;
}
}
Line 255: Line 402:
.left-menu li a:hover {
.left-menu li a:hover {
-
color: #111111;
+
color: white;
}
}
Line 288: Line 435:
.right-menu li a:hover {
.right-menu li a:hover {
-
color: #111111;
+
color: white;
 +
text-decoration:underline;
}
}
Line 306: Line 454:
border: 0px;
border: 0px;
}
}
-
 
+
.new {
 +
color:white;
 +
}
#footer-box {
#footer-box {
Line 320: Line 470:
a {
a {
-
color: #0088cc;
+
color: white;
text-decoration: none;
text-decoration: none;
}
}
a:hover {
a:hover {
-
color: #005580;
+
color: white;
-
text-decoration: none! important;
+
text-decoration: underline;
}
}
Line 332: Line 482:
display: none;
display: none;
}
}
-
 
p {
p {
margin: 0px;
margin: 0px;
}
}
-
 
+
#left-menu {
-
 
+
margin-left:5px;
-
#js_con {
+
-
color: black;
+
}
}
</style>
</style>
Line 523: Line 670:
</script>
</script>
</head>
</head>
 +
<body>
 +
<div id="header-wrapper">
 +
<div id="header">
 +
  <div id="title">
 +
    <p>NCTU_Formosa</p>
 +
  </div>
 +
  <div id="menu">
 +
    <ul>
 +
      <li class="m1 current"><a href="#" title="Home" class="current">Home</a></li>
 +
      <li class="m2"><a href="#" title="Project" class="link">Project</a></li>
 +
      <li class="m3"><a href="#" title="Note" class="link">Note</a></li>
 +
      <li class="m4"><a href="#" title="Parts Submitted" class="link">Parts Submitted</a></li>
 +
      <li class="m5"><a href="#" title="Safety" class="link">Satety</a></li>
 +
      <li class="m6"><a href="#" title="Human Practice" class="link">Human Practice</a></li>
 +
      <li class="m7"><a href="#" title="Official Team Profile" class="link">Official Team Profile</a></li>
 +
    </ul>
 +
  </div>
 +
</div>
 +
</div>

Latest revision as of 13:48, 2 September 2012

Team:NCTU Formosa - 2012.igem.org