Team:Tokyo-NoKoGen/css

From 2010.igem.org

(Difference between revisions)
m
 
(121 intermediate revisions not shown)
Line 1: Line 1:
-
@charset "utf-8";
 
-
/* CSS Document */
 
-
 
<html>
<html>
<style type="text/css">
<style type="text/css">
 +
 +
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 +
        <html xmlns="http://www.w3.org/1999/xhtml">
/* change the igem style to fit my design */
/* change the igem style to fit my design */
-
#content {background:     #2000a0; border: 0px;}
+
#content {background:#2000a0; border:0px; margin-top: 30px; margin-left: 20px; margin-right: 20px;}
#content h1.firstHeading {display: none;}
#content h1.firstHeading {display: none;}
 +
/* =====  Basic rules  ===== */
 +
<!--
 +
body
 +
{background-image: url(https://static.igem.org/mediawiki/2010/e/e3/NoKoGen_BackGround.png);  background-repeat: repeat;
 +
background-color: #FFFFFF;
 +
}
 +
-->
-
/* layout */
+
/* =====  Roll up image  ===== */
-
* {font-size: 100%; margin: 0; padding: 0;}
+
a img.css-hover{
-
body {position: relative; background-image: url(https://static.igem.org/mediawiki/2010/1/12/Nokogen_Bg.png); background-repeat: repeat-x; #000000; background-color: #FFFFFF;}
+
opacity:0; filter: alpha(opacity=0);
-
#pagewrapper {display: block; background:#FFFFFF; text-align: left; margin: 0 auto; font: 90%, Verdana, Arial, Helvetica, sans-serif; background-mage: url(https://static.igem.org/mediawiki/2010/1/12/Nokogen_Bg.png); }
+
}
-
#titleheader {display:block; background: url(https://static.igem.org/mediawiki/2010/3/34/Header_background.jpg); }
+
a:hover img.css-hover{
-
#subtitle { 0px 50% no-repeat; padding: 0px 0px 0px 0px; color:#fff;}
+
opacity:1.0; filter: alpha(opacity=100);
-
h3.toptitle {font: Tahoma, Verdana, Arial, sans-serif; color: #fff; letter-spacing: -1px;}
+
}
-
h1.maintitle {font: 2.2em Tahoma, Verdana, Arial, sans-serif; color: #000000; letter-spacing: -1px;}
+
-
h3.maintitle {font: 2.2em Tahoma, Verdana, Arial, sans-serif; color: #000000; letter-spacing: -1px;}
+
-
h1.maintitle a, h1 a:link, h1 a:visited, h1 a:hover {color: #fff; text-decoration: none;}
+
-
h3.maintitle a, h3 a:link, h3 a:visited, h3 a:hover {color: #000000; text-decoration: none;}
+
-
.commentbar {color: #FFFFFF; margin: 5px 0px 0px 0px;}
+
-
.commentbar a, a:visited {color: white; text-decoration: none;}
+
-
#mainnavigation {margin: 0px 7px 0px 7px; padding: 10px 20px 10px 20px;}
+
-
#mainpic {height:270px; border-top: 0px solid gray;border-bottom: 0px solid gray;margin: 0px;}
+
-
#pagetitlewrapper {border-top: 0px solid gray; height: 75px; position :relative; padding: 0px 0px 0px 20px; top:200px;}
+
-
 
+
-
.wide { width: 100%; background-color:#FFFFFF; color: #000000; padding: 10px; border: 0px solid #AAAAAA;  padding: 10px; margin: 0px 10px 0px 17px; float:center; display: inline;}
+
-
.wide img {border: 0px solid #AAAAAA;}
+
-
.wide p {margin: 0px 15px 0px 15px; }
+
-
.wide h2 {font-weight: bold;}
+
-
.wide h1 {font-weight: bold; margin: 10px 15px 10px 15px;}
+
-
.wide h3 {margin: 10px 15px 10px 15px;}
+
-
 
+
-
 
+
-
table.nav {width:100%; margin:0; cellpadding:5px; cellspacing:0; border:1px; bordercolor:#AAAAAA; font color:#000000; background:#FFFFFF;}
+
-
 
+
-
table.parameter {width:90%; display: block; margin-left: auto; margin-right: auto; cellpadding:0px; cellspacing:0; border:0px; bordercolor:#AAAAAA; font color:#000000; align:center; background:#FFFFFF; }
+
-
table.parameter td { padding:0px; }
+
-
 
+
-
table.hill {width:60%; display: block; float:right; cellpadding:0px; cellspacing:0; border:0px; bordercolor:#AAAAAA; font color:#000000; align:center; background:#FFFFFF; }
+
-
table.hill td { padding:0px;}
+
-
 
+
-
img.floatleft {float: left; margin: 4px; clear:both;}
+
-
 
+
-
.leftcolumn {float: left; margin: 0px 10px 10px 17px; width: 150px; display: inline;}
+
-
.rightcolumn {float: right; margin: 0px 10px 10px 17px; width: 550px; display: inline;}
+
-
 
+
-
.space {clear:both; }
+
-
 
+
-
 
+
-
 
+
-
.left { width: 775px; background-color:#FFFFFF; color: #555555; padding: 10px; border: 1px solid #AAAAAA;  padding: 10px; margin: 0px 10px 10px 10px; float:left; display: inline;}
+
-
.left img {border: 0px solid #AAAAAA; }
+
-
.left p {margin: 10px 0px 5px 0px; }
+
-
.left h2 {font-weight: bold;}
+
-
 
+
-
 
+
-
.right { width: 200px; background-color: #FFFFFF; color: #555555; padding: 10px; border: 1px solid #AAAAAA; margin: 0px 10px 10px 0px; float:right; display:inline;}
+
-
.right img {border: 0px solid #AAAAAA; }
+
-
.right p {margin: 10px 0 5px 0; }
+
-
.right h2 {font-weight: bold;}
+
-
 
+
-
 
+
-
div.thumbnail {padding: 10px; border: solid #AAAAAA 1px; width: 152px; background-color: #fff}
+
-
 
+
-
 
+
-
/* typography */
+
-
 
+
-
.description {color: #003000; margin: 0 37px 0px 37px;}
+
-
.title h2 {font: 1.05em Arial, Helvetica, sans-serif; text-transform: uppercase; padding: 9px 24px 12px 24px;}
+
-
.title h3 {font: 1.5em Arial, Helvetica, sans-serif; text-transform: uppercase; padding: 9px 24px 12px 24px;}
+
-
.title small {float: right; padding: 14px 24px 0 0; color: #67939B;}
+
-
#pagetitle {}
+
-
#pagesubtitle {color: #283234;}
+
-
#maintitle {font: 2.0em Tahoma, Verdana, Arial, sans-serif; margin: 4px 0 0 0;}
+
-
 
+
-
 
+
-
/* links */
+
-
a:link, a:visited {text-decoration: none; color:#003399;}
+
-
a:hover {color: #D76519;}
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
 
+
-
/*======================== MENU STYLE =========================*/
+
/* ====== MENU STYLE ====== */
Line 132: Line 63:
padding:0;
padding:0;
border:0;
border:0;
-
height:30px;                                  /* the menu's overall height */
+
height:15px;                                  /* the menu's overall height */
width:100%;        /* we always want our menu to fill the available space */
width:100%;        /* we always want our menu to fill the available space */
font-family: Verdana, Arial, Helvetica, sans-serif;
font-family: Verdana, Arial, Helvetica, sans-serif;
-
font-size:14px;        /* this (and also below) sets the menu's font size */
+
font-size:15px;        /* this (and also below) sets the menu's font size */
border-bottom:0;        /* give us a black border underneath */
border-bottom:0;        /* give us a black border underneath */
}
}
Line 149: Line 80:
border:0;
border:0;
list-style-type:none;          /* we don't want to view the list as a list */
list-style-type:none;          /* we don't want to view the list as a list */
-
line-height:2em;          /* globally set the menu's item spacing. note */
+
line-height:2.0;          /* globally set the menu's item spacing. note */
}                              /* this must be 1.0 or 1.5 or 2.0 for Mozilla */
}                              /* this must be 1.0 or 1.5 or 2.0 for Mozilla */
Line 161: Line 92:
.menu ul li table {
.menu ul li table {
margin:-1px 0;              /* IE5 needs -1px top and bottom table margins */
margin:-1px 0;              /* IE5 needs -1px top and bottom table margins */
-
m\argin:0;              /* re-zero the table margins for everyone but IE5 */
+
margin:0;              /* re-zero the table margins for everyone but IE5 */
border-collapse:collapse;      /* IE5 needs this for the sub-menus to work */
border-collapse:collapse;      /* IE5 needs this for the sub-menus to work */
font-size:12px;        /* this sets the base font size for our entire menu */
font-size:12px;        /* this sets the base font size for our entire menu */
Line 170: Line 101:
.drop {
.drop {
display:block;
display:block;
-
padding:0px .5em;       /* this sets the l/r margins for our menu item */
+
padding:0px .1em;       /* this sets the l/r margins for our menu item */
margin:0;
margin:0;
text-align:right;  /* this right alignment goes with the float:left below */
text-align:right;  /* this right alignment goes with the float:left below */
Line 220: Line 151:
position:absolute;
position:absolute;
margin:0;
margin:0;
-
top:22px;              /* place us just up underneath the top-level images */
+
top:15px;              /* place us just up underneath the top-level images */
-
left:8px;      /* left-align our drop-down to the previous button border */
+
left:0px;      /* left-align our drop-down to the previous button border */
height:auto;      /* the drop-down height will be determiend by line count */
height:auto;      /* the drop-down height will be determiend by line count */
-
width:14em;
+
width:12em;
color:black;                        /* this sets the unselected-text color */
color:black;                        /* this sets the unselected-text color */
-
background:#ffffff;        /* this sets our menu's effective "border" color */
+
background:#00ccff;        /* this sets our menu's effective "border" color */
font-size:12px;        /* this (and also below) sets the menu's font size */
font-size:12px;        /* this (and also below) sets the menu's font size */
list-style: none;
list-style: none;
Line 237: Line 168:
.menu ul li:hover ul.skinny,
.menu ul li:hover ul.skinny,
.menu ul li a:hover ul.skinny {            /* 2nd level skinny drop-down box */
.menu ul li a:hover ul.skinny {            /* 2nd level skinny drop-down box */
-
width:8.08333em;  /* with a 12px default font, this is 97px width (97/12) */
+
width:14em;  /* with a 12px default font, this is 97px width (97/12) */
}
}
Line 256: Line 187:
padding:0;
padding:0;
height:auto;
height:auto;
-
color:#ffffff;              /* this sets the unselected drop-down text color */
+
color:#000000;              /* this sets the unselected drop-down text color */
-
background:#838d84;      /* this sets the drop-down menu background color */
+
background:#ccffff;      /* this sets the drop-down menu background color */
-
width:14em;
+
width:12em;
}
}
Line 296: Line 227:
width:14em;
width:14em;
background:#838d84;
background:#838d84;
-
         color:#ffffff;
+
         color:#000000;
}
}
Line 313: Line 244:
a.menu {
a.menu {
   color: white;
   color: white;
-
   width: 12em;
+
   width: 10em;
 +
  align:center;
}
}
Line 322: Line 254:
table {
table {
-
   font-color: #ffffff;
+
   font-color: #000000;
}
}
 +
a.menu {
a.menu {
-
   color: #ffffff;
+
   color: #000000;
-
   width: 12em;
+
   width: 10em;
}
}
-
 
-
 
-
 
-
 
Line 342: Line 271:
#wikifooter p {color: #808080; padding: 0px 37px 20px 37px;}
#wikifooter p {color: #808080; padding: 0px 37px 20px 37px;}
#wikifooter a, #wikifooter a:visited {color: #808080;}
#wikifooter a, #wikifooter a:visited {color: #808080;}
-
 
-
 
-
 
-
 
</style>
</style>
</html>
</html>

Latest revision as of 09:27, 27 October 2010