Template:Team:NCTU Formosa/header

From 2012.igem.org

(Difference between revisions)
 
(84 intermediate revisions not shown)
Line 6: Line 6:
<meta name="Robots" content="all" />
<meta name="Robots" content="all" />
<meta name="keywords" content="iGEM, NCTU_Formosa, NCTU, Formosa" />
<meta name="keywords" content="iGEM, NCTU_Formosa, NCTU, Formosa" />
 +
<meta property="og:title" content="NCTU Formosa - 2012.igem.org" />
 +
<meta property="og:type" content="website" />
 +
<meta property="og:image" content="https://static.igem.org/mediawiki/2012/d/d1/NctuCapture.jpg" />
 +
<meta property="og:site_name" content="NCTU Formosa - 2012.igem.org"/>
 +
<meta property="og:description" content="The wiki site of 2012 NCTU_Formosa team." />
<style type="text/css">  
<style type="text/css">  
/* http://meyerweb.com/eric/tools/css/reset/ */
/* http://meyerweb.com/eric/tools/css/reset/ */
Line 66: Line 71:
}
}
body {
body {
-
background:url(https://static.igem.org/mediawiki/2012/0/0b/NctuformosaBg.jpg) fixed;
+
background:#666666 url(https://static.igem.org/mediawiki/2012/0/0b/NctuformosaBg.jpg) fixed;
color:#3c3c3c;
color:#3c3c3c;
font:14px Helvetica, Arial, Sans-serif;
font:14px Helvetica, Arial, Sans-serif;
overflow-x:hidden;
overflow-x:hidden;
 +
}
 +
body:before {
 +
          content: "";
 +
          position: fixed;
 +
          top: -10px;
 +
          left: 0;
 +
          width: 100%;
 +
          height: 10px;
 +
 +
          -webkit-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
 +
              -moz-box-shadow: 0px 0px 10px rgba(0,0,0,.8);
 +
                        box-shadow: 0px 0px 10px rgba(0,0,0,.8);
 +
 +
          z-index: 100;
 +
}
 +
::selection {
 +
background:#fc0;
 +
color:#fff;
 +
}
 +
::-moz-selection {
 +
background:#fc0;
 +
color:#fff;
 +
}
 +
::-webkit-selection {
 +
background:#fc0;
 +
color:#fff;
 +
}
 +
@font-face {
 +
  font-family: 'Orienta';
 +
  font-style: normal;
 +
  font-weight: 400;
 +
  src: local('Orienta'), local('Orienta-Regular'), url(http://themes.googleusercontent.com/static/fonts/orienta/v1/nPJ0J30J_zQZtBhztPPbaA.woff) format('woff');
}
}
a {
a {
Line 93: Line 130:
}
}
#title {
#title {
-
width:483px;
+
width:100%;
height:50px;
height:50px;
-
text-indent:-9999px;
+
background:url(https://static.igem.org/mediawiki/2012/0/07/NctuTitle.png) transparent top left no-repeat;
-
background:url(https://static.igem.org/mediawiki/2012/b/b3/Title.png) transparent top left no-repeat;
+
margin-top: 5px;
margin-top: 5px;
margin-left: 3px;
margin-left: 3px;
 +
}
 +
#title span {
 +
text-indent:-9999px;
 +
}
 +
#tmenu {
 +
position: relative;
 +
left: 914px;
 +
width:98px;
 +
height:30px!important;
 +
padding:0;
 +
overflow:hidden;
 +
}
 +
#tmenu li a {
 +
display:block;
 +
width:100%;
 +
text-indent:-9999px;
 +
background:url(https://static.igem.org/mediawiki/2012/7/7c/Topmenu.png) transparent no-repeat 0 0;
 +
}
 +
#tmenu li, #tmenu li a {
 +
display:block;
 +
float: right;
 +
margin-bottom:3px;
 +
}
 +
#tmenu .m1, #tmenu .m1 a {
 +
display:block;
 +
list-style: none;
 +
width:54px;
 +
height:12px;
 +
}
 +
#tmenu .m1 a, #tmenu .m1 a:link {
 +
background-position:0 0;
 +
}
 +
#tmenu .m1 a:hover, #tmenu .m1 a:active {
 +
background-position:-98px 0px;
 +
}
 +
#tmenu .m2, #tmenu .m2 a {
 +
display:block;
 +
list-style: none;
 +
width:98px;
 +
height:12px;
 +
}
 +
#tmenu .m2 a, #tmenu .m2 a.link {
 +
background-position:0 -13px;
 +
}
 +
#tmenu .m2 a:hover, #tmenu .m2 a:active{
 +
background-position:-98px -13px;
}
}
#main-wrapper {
#main-wrapper {
Line 109: Line 191:
width: 100%;
width: 100%;
padding: 0px;
padding: 0px;
-
font:14px Helvetica, Arial, Sans-serif;
+
// font:14px Helvetica, Arial, Sans-serif;
-
 
+
font-size:14px;
-
#eee, 1px -1px 0px #eee;
+
font-family: 'Orienta', sans-serif;
-
font-weight:600;
+
font-weight:500;
}
}
ul {
ul {
line-height:normal;
line-height:normal;
}
}
-
h1 {
+
h1, h2 {
font:14px Helvetica, Arial, Sans-serif;
font:14px Helvetica, Arial, Sans-serif;
padding-top:0px;
padding-top:0px;
Line 128: Line 210:
}
}
#footer-text {
#footer-text {
 +
width:100%;
margin-top: 10px;
margin-top: 10px;
margin-bottom: 20px;
margin-bottom: 20px;
text-align: right;
text-align: right;
font-size:9px;
font-size:9px;
-
color:#dddddd;
+
color:#333333;
}
}
-
#footer-text a {
+
.emph {
-
color:#dddddd;
+
font-weight:600;
 +
}
 +
#counter, #counter img {
 +
width:1px;
 +
height:1px;
 +
visibility: hidden;
 +
}
 +
.thumbnail {
 +
width:1px;
 +
height:1px;
 +
visibility: hidden;
 +
}
 +
#footer-text a, #footer-text a:hover, #footer-text a:visited {
 +
color:#333333;
text-decoration:underline;
text-decoration:underline;
}
}
#menu {
#menu {
-
width:305px;
+
width:100%;
height:117px!important;
height:117px!important;
padding:0;
padding:0;
Line 149: Line 245:
#menu li, #menu li a {
#menu li, #menu li a {
display:block;
display:block;
-
width:305px;
+
width:250px;
list-style: none;
list-style: none;
}
}
Line 155: Line 251:
width:100%;
width:100%;
text-indent:-9999px;
text-indent:-9999px;
-
background:url(https://static.igem.org/mediawiki/2012/9/99/Menu.png) transparent no-repeat 0 0;
+
background:url(https://static.igem.org/mediawiki/2012/9/9b/Nctumenu.png) transparent no-repeat 0 0;
 +
//-webkit-transition:all 1.0s ease-in-out;
 +
//-moz-transition:all 1.0s ease-in-out;
 +
//o-transition:all 1.0s ease-in-out;
 +
//transition:all 1.0s ease-in-out;
}
}
#menu .m1 {
#menu .m1 {
Line 220: Line 320:
background-position:-305px -100px;
background-position:-305px -100px;
}
}
-
.author {
+
#menu .m8 {
-
display:none;
+
height:18px;
}
}
-
/*
+
#menu .m8 a.link, #menu .m8 a.link:link {
-
---Calvin Hue
+
background-position:0 -117px;
-
*/
+
-
 
+
-
#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 {
+
#menu .m8 a.link:hover, #menu .m8 a.link:active, #menu .m8 .current{
-
height: 340px;
+
background-position:-305px -117px;
}
}
-
#cover {
+
ul li {
-
padding-top:15px;
+
  position: relative;
}
}
-
#abstract-wrapper {
+
ul ul {
-
width: 49%;
+
  position: absolute;
-
min-height:250px;
+
  left: 100%;
-
float: left;
+
  list-style: none;
 +
  display: none;
}
}
-
#news-wrapper {
+
.ms {
-
width: 49%;
+
width:305px;
-
min-height:250px;
+
height:117px!important;
-
float: right;
+
padding:0;
 +
overflow:hidden;
 +
font:14px Helvetica, Arial, Sans-serif;
}
}
-
#abstract-title {
+
#m2s {
-
width: 307px;
+
top:-17px;
-
height: 30px!important;
+
-
background:url(https://static.igem.org/mediawiki/2012/3/31/Subtitle-abstract.png) transparent no-repeat;
+
}
}
-
#abstract-title span {
+
#m3s {
-
display: none;
+
top:-24px;
}
}
-
#abstract p, #news p {
+
#m6s {
-
margin:10px;
+
top:-85px;
}
}
-
#news-title {
+
.ms li, .ms li a {
-
width: 307px;
+
display:block;
-
height: 30px!important;
+
width:305px!important;
-
background:url(https://static.igem.org/mediawiki/2012/7/75/Subtitle-news.png) transparent no-repeat;
+
list-style: none;
}
}
-
#news-title span {
+
ul li:hover > ul {
-
display: none;
+
  display: block;
}
}
-
 
+
#m2s li a {
-
/* slider */
+
background:url(https://static.igem.org/mediawiki/2012/0/05/Submenu-project.png) transparent no-repeat 0 0;
-
/* 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 {
+
#m3s li a {
-
position:absolute;
+
background:url(https://static.igem.org/mediawiki/2012/c/c9/Submenu-team.png) transparent no-repeat 0 0;
-
border:none;
+
-
display:none;
+
}
}
-
 
+
#m6s li a {
-
/* the link style (if an image is wrapped in a link) */
+
background:url(https://static.igem.org/mediawiki/2012/e/ee/Submenu-human.png) transparent no-repeat 0 0;
-
#slider a.imgLink {
+
-
z-index:2;
+
-
display:none;position:absolute;
+
-
top:0px;left:0px;border:0;padding:0;margin:0;
+
-
width:100%;height:100%;
+
}
}
-
 
+
.ms li a {
-
/* Caption styles */
+
-
div.mc-caption-bg, div.mc-caption-bg2 {
+
-
display:none;
+
-
position:absolute;
+
width:100%;
width:100%;
-
height:auto;
+
text-indent:-9999px;
-
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 {
+
.ms .ms1 {
-
background-color:black;
+
height:17px;
}
}
-
div.mc-caption {
+
.ms .ms1 a, .ms .ms1 a:link {
-
display:none;
+
background-position:0 0!important;
-
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 {
+
.ms .ms1 a:hover, .ms .ms1 a:active{
-
color:#FB0;
+
background-position:-305px 0px!important;
}
}
-
div.mc-caption a:hover {
+
.ms .ms2 {
-
color:#DA0;
+
height:17px;
}
}
-
 
+
.ms .ms2 a, .ms .ms2 a:link {
-
 
+
background-position:0 -17px!important;
-
/* ------ 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;
+
}
}
-
 
+
.ms .ms2 a:hover, .ms .ms2 a:active{
-
/* each bullet */
+
background-position:-305px -17px!important;
-
div.navBulletsWrapper div
+
-
{
+
-
    width:11px; height:11px;
+
-
    background:transparent url(https://static.igem.org/mediawiki/2012/7/7a/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*/
+
}
}
-
 
+
.ms .ms3 {
-
div.navBulletsWrapper div.active {background-position:0 -11px;}
+
height:17px;
-
 
+
}
-
 
+
.ms .ms3 a, .ms .ms3 a:link {
-
/* --------- Others ------- */
+
background-position:0 -34px!important;
-
#slider
+
}
-
{
+
.ms .ms3 a:hover, .ms .ms3 a:active{
-
transform: translate3d(0,0,0);
+
background-position:-305px -34px!important;
-
    -ms-transform:translate3d(0,0,0);
+
}
-
    -moz-transform:translate3d(0,0,0);
+
.ms .ms4 {
-
    -o-transform:translate3d(0,0,0);
+
height:17px;
 +
}
 +
.ms .ms4 a, .ms .ms4 a:link {
 +
background-position:0 -51px!important;
 +
}
 +
.ms .ms4 a:hover, .ms .ms4 a:active{
 +
background-position:-305px -51px!important;
 +
}
 +
.ms .ms5 {
 +
height:17px;
 +
}
 +
.ms .ms5 a, .ms .ms5 a:link {
 +
background-position:0 -68px!important;
 +
}
 +
.ms .ms5 a:hover, .ms .ms5 a:active{
 +
background-position:-305px -68px!important;
 +
}
 +
.ms .ms6 {
 +
height:17px;
 +
}
 +
.ms .ms6 a, .ms .ms6 a:link {
 +
background-position:0 -85px!important;
 +
}
 +
.ms .ms6 a:hover, .ms .ms6 a:active{
 +
background-position:-305px -85px!important;
 +
}
 +
.ms .ms7 {
 +
height:17px;
 +
}
 +
.ms .ms7 a, .ms .ms7 a:link {
 +
background-position:0 -102px!important;
 +
}
 +
.ms .ms7 a:hover, .ms .ms7 a:active{
 +
background-position:-305px -102px!important;
 +
}
 +
.ms .ms8 {
 +
height:17px;
 +
}
 +
.ms .ms8 a, .ms .ms8 a:link {
 +
background-position:0 -119px!important;
 +
}
 +
.ms .ms8 a:hover, .ms .ms8 a:active{
 +
background-position:-305px -119px!important;
 +
}
 +
.author {
 +
display:none;
}
}
#p-logo {
#p-logo {
Line 401: Line 475:
text-align: left;
text-align: left;
text-transform: capitalize;
text-transform: capitalize;
-
}
 
-
 
-
.left-menu:hover {
 
-
background-color: transparent;
 
-
}
 
-
 
-
.left-menu:hover a {
 
-
color: white;
 
-
text-decoration: none !important;
 
}
}
.left-menu li a:hover {
.left-menu li a:hover {
color: white;
color: white;
-
}
+
text-decoration:underline;
-
 
+
-
 
+
-
.right-menu li a {
+
-
background-color: transparent;
+
-
}
+
-
 
+
-
.right-menu li{
+
-
background-color: transparent;
+
}
}
Line 431: Line 488:
}
}
-
.right-menu:hover {
+
.right-menu:hover, .left-menu:hover {
background-color: transparent;
background-color: transparent;
}
}
Line 439: Line 496:
}
}
-
.right-menu li a {
+
.right-menu li a, .left-menu li a {
background-color: transparent;
background-color: transparent;
color: white;
color: white;
Line 448: Line 505:
color: white;
color: white;
text-decoration:underline;
text-decoration:underline;
 +
}
 +
.right-menu li a:visited {
 +
color: white;
}
}
Line 472: Line 532:
display: none;
display: none;
}
}
-
 
+
a, a:visited {
-
 
+
-
#footer {
+
-
margin: 0 auto;
+
-
width: 95%;
+
-
}
+
-
 
+
-
 
+
-
a {
+
color: white;
color: white;
text-decoration: none;
text-decoration: none;
Line 501: Line 553:
</style>
</style>
<script src="https://2012.igem.org/Template:Team:NCTU_Formosa/js?action=raw"></script>
<script src="https://2012.igem.org/Template:Team:NCTU_Formosa/js?action=raw"></script>
-
</head>
 
-
<body>
 
-
<div id="header-wrapper">
 
-
<div id="header">
 
-
  <div id="title">
 
-
    <p>NCTU_Formosa</p>
 
-
  </div>
 

Latest revision as of 21:06, 26 October 2012

Team:NCTU Formosa - 2012.igem.org