Template:Team:HokkaidoU Japan/css

From 2011.igem.org

(Difference between revisions)
Line 6: Line 6:
   <body>
   <body>
     <link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css" type="text/css">
     <link rel="stylesheet" href="http://twitter.github.com/bootstrap/1.3.0/bootstrap.min.css" type="text/css">
-
     <link rel="stylesheet" href="https://raw.github.com/giginet/iGEM-Wiki/master/css/generic.css" type="text/css" />
+
     <style>
-
  </body>
+
html, body {
 +
  width: 100%;
 +
  height: 100%;
 +
  min-height: 100%;
 +
  position: relative;
 +
}
 +
 
 +
h1 {
 +
  color: #fefefe;
 +
  text-shadow: 1px 1px 0.5px black;
 +
  background: rgb(201,222,150);
 +
  background: -moz-linear-gradient(top, rgba(201,222,150,1) 0%, rgba(138,182,107,1) 44%, rgba(57,130,53,1) 100%);
 +
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(201,222,150,1)), color-stop(44%,rgba(138,182,107,1)), color-stop(100%,rgba(57,130,53,1)));
 +
  background: -webkit-linear-gradient(top, rgba(201,222,150,1) 0%,rgba(138,182,107,1) 44%,rgba(57,130,53,1) 100%);
 +
  background: -o-linear-gradient(top, rgba(201,222,150,1) 0%,rgba(138,182,107,1) 44%,rgba(57,130,53,1) 100%);
 +
  background: -ms-linear-gradient(top, rgba(201,222,150,1) 0%,rgba(138,182,107,1) 44%,rgba(57,130,53,1) 100%);
 +
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#c9de96', endColorstr='#398235',GradientType=0 );
 +
  background: linear-gradient(top, rgba(201,222,150,1) 0%,rgba(138,182,107,1) 44%,rgba(57,130,53,1) 100%);
 +
  border-radius: 5px 5px 0px 0px;
 +
  -moz-border-radius: 5px; 5px 0px 0px;
 +
  -webkit-border-radius: 5px; 5px 0px 0px;
 +
  padding: 3px 8px;
 +
}
 +
 
 +
h2 {
 +
  color: #333333;
 +
  border-left:7px solid rgb(201,222,150);
 +
  border-bottom:1px solid #ccc;
 +
  margin: 25px 3px 10px;
 +
  padding:6px 8px;
 +
}
 +
 
 +
article h3 {
 +
  color: #333333;
 +
  border-bottom:1px solid #ccc;
 +
  margin: 20px 3px 10px;
 +
}
 +
 
 +
header {
 +
  position: relative;
 +
  border-bottom: solid 1px #dedede;
 +
  width: 100%;
 +
  height: 100px;
 +
}
 +
 
 +
header > div.header {
 +
  margin: 0 auto;
 +
  width: 975px;
 +
  height: 100%;
 +
  position: relative;
 +
}
 +
 
 +
header div#logo {
 +
  border: 1px solid #dedede;
 +
  margin: 0 auto;
 +
  width: 275px;
 +
  height: 100px;
 +
  position: absolute;
 +
  float: left;
 +
}
 +
 
 +
header nav#header-menu {
 +
  margin: 0;
 +
  padding: 0;
 +
  width: 700px;
 +
  height: 100px;
 +
  right: 0px;
 +
  position: absolute;
 +
}
 +
 
 +
header nav#header-menu ul {
 +
  margin: 0px;
 +
  padding: 0px;
 +
  height: 30px;
 +
  right: 5px;
 +
  bottom: 0;
 +
  position: absolute;
 +
  vertical-align: bottom;
 +
  list-style: none;
 +
}
 +
 
 +
header nav#header-menu ul li {
 +
  margin: 0 1px;
 +
  padding: 4px 5px 2px;
 +
  border: solid 2px #dedede;
 +
  border-bottom-style: none;
 +
  border-radius: 5px 5px 0px 0px;
 +
  -moz-border-radius: 5px; 5px 0px 0px;
 +
  -webkit-border-radius: 5px; 5px 0px 0px;
 +
  height: 24px;
 +
  bottom: 0;
 +
  float: left;
 +
  cursor: pointer;
 +
}
 +
 
 +
nav#header-menu ul li:hover, nav#header-menu ul li.selected {
 +
  color: #ffffff;
 +
  text-shadow: 1px 1px 1px gray;
 +
  background: rgb(201,222,150);
 +
}
 +
 
 +
section#main {
 +
  margin: 0 auto;
 +
  width: 975px;
 +
  height: auto;
 +
  min-height: 200px;
 +
}
 +
 
 +
article#content {
 +
  padding: 0px 5px 50px 5px;
 +
}
 +
 
 +
footer {
 +
  background-color: #efefef;
 +
  border-top: 2px solid #dedede;
 +
  width: 100%;
 +
  height: 300px;
 +
  bottom: 0px;
 +
}
 +
 
 +
footer h3 {
 +
  color: #666666;
 +
  text-shadow: 2px 2px 5px #fefefe;
 +
}
 +
 
 +
footer ul {
 +
  margin-top: 0;
 +
  list-style: none;
 +
}
 +
 
 +
footer div#footer {
 +
  margin: 0 auto;
 +
  width: 975px;
 +
}
 +
 
 +
footer div.wrapper {
 +
  height: 220px;
 +
  position: relative;
 +
  bottom: 0;
 +
}
 +
 
 +
section#sponsors {
 +
  width: 975px;
 +
  height: 80px;
 +
  text-align: center;
 +
}
 +
 
 +
section#sponsors ul li {
 +
  margin: 2px 5px;
 +
  display: inline-block;
 +
}
 +
 
 +
.footer-col {
 +
  width: 320px;
 +
}
 +
 
 +
.footer-col ul {
 +
  padding-left: 7px;
 +
}
 +
 
 +
.footer-col address {
 +
  margin-left: 7px;
 +
}
 +
 
 +
nav#footer-menu li.selected {
 +
  color: #42426F;
 +
}
 +
 
 +
nav#footer-about {
 +
  float: left;
 +
}
 +
 
 +
nav#footer-menu {
 +
  float: left;
 +
}
 +
 
 +
div#footer-right {
 +
  float: left;
 +
}
 +
 
 +
section#footer-contact address {
 +
  color: gray;
 +
}
 +
 
 +
    </style>
 +
</body>
</html>
</html>

Revision as of 09:59, 1 October 2011

HokkaidoU_Japan:CSS