Template:Team:HokkaidoU Japan/Top Header/CSS

From 2014.igem.org

(Difference between revisions)
 
(45 intermediate revisions not shown)
Line 1: Line 1:
<html>
<html>
<style type="text/css">
<style type="text/css">
-
#header-wrapper {
 
-
    width:100%;
 
-
    background-color:#CD0B1B
 
-
}
 
-
 
-
#top-header {
 
-
    width: 958px;
 
-
    height: 235px;
 
-
    margin: 0 auto;
 
-
    background-image:url("https://static.igem.org/mediawiki/2014/7/77/HokkaidoU_Top_Header.png");
 
-
    border-right:solid 3px #CD0B1B
 
-
}
 
-
 
-
#top-logo {
 
-
    width:400px;
 
-
    height:300px;
 
-
    margin: 0 auto;
 
-
    position:relative;
 
-
    background-image:url("https://static.igem.org/mediawiki/2014/1/12/HokkaidoU_2014_Logo.png");
 
-
}
 
#header-image {
#header-image {
     width:960px;
     width:960px;
-
     height:250px;
+
     height:240px;
     margin: 0 auto;
     margin: 0 auto;
}
}
-
.bookmark {
+
#header-wrapper {
-
     width:100px;
+
     width:100%;
-
    height:250px;
+
     background-color:#d92424;
-
     background-color: #ee9fd8;
+
-
    position: relative;
+
-
    margin: 0 40px;
+
-
    top: 150px;
+
-
    text-align:center;
+
-
    line-height: 14px;
+
-
    float: left;
+
}
}
-
.bookmark-contents {
+
#header-top img
-
    margin: 20px auto;
+
{  width:100%;
}
}
-
.bookmark-contents-sub {
 
-
    margin: 15px auto;
 
-
    line-height: 20px;
 
-
}
 
-
#bookmark-position {
+
#header-top {
-
     height: 200px;
+
     width:100%;
-
     position: relative;
+
     height:25px;
-
     margin: 0 auto;
+
     background-color:#d92424;
-
    overflow: hidden;
+
}
}
-
.bookmark-position > div {
+
#header-bottom {
-
     display: inline-block;
+
     width:100%;
 +
    height:180px;
 +
    background-color:#d92424;
}
}
-
 
+
#header-bottom-contents {
-
<!-- megamenu-->
+
    width:960px;
-
/*
+
    margin: 0 auto;
-
  jQuery MegaMenu Plugin
+
-
  Author: GeekTantra
+
-
  Author URI: http://www.geektantra.com
+
-
*/
+
-
 
+
-
ul.megamenu {
+
-
  background-color: black;
+
-
  margin: 0px auto;
+
-
  padding: 5px 10px;
+
-
  list-style: none;
+
-
  display: none;
+
}
}
-
ul.megamenu li.mm-item {
+
#top-header {
 +
    width: 960px;
 +
    height: 240px;
 +
    margin: 0 auto;
}
}
-
ul.megamenu li {
+
.header-picture {
-
  margin: 0px;
+
    position:relative;
-
  padding: 0px;
+
    float:right;
 +
    top:20px;
 +
   
}
}
-
ul.megamenu li.clear-fix {
+
.header-picture > img {
-
  float: none;
+
    height:150px;
-
  clear: both;
+
    position:relative;
-
  margin: 0px;
+
-
  padding: 0px;
+
-
  height: 0px;
+
-
  font-size: 0px;
+
-
  line-height: 0px;
+
}
}
-
ul.megamenu a.mm-item-link:link, ul.megamenu a.mm-item-link:visited {
+
.header-title {
-
  position: relative;
+
    height:150px;
-
  display: inline-block;
+
    width:600px;
-
  color: #FFF;
+
    float:left;
-
  padding: 8px 15px;
+
font-family: 'Special Elite', cursive;
-
  margin: 0px 3px 0px 0px;
+
   color:white;
-
  text-decoration: none;
+
-
  z-index: 10;
+
-
  font-size: 14px;
+
-
   border-top: 1px solid transparent;
+
-
  border-left: 1px solid transparent;
+
-
  border-right: 1px solid transparent;
+
-
}
+
-
*html ul.megamenu a.mm-item-link:link, *html ul.megamenu a.mm-item-link:visited {
+
-
  border-color: pink;
+
-
  filter: chroma(color=pink);
+
-
}
+
-
ul.megamenu a.mm-item-link-hover:link, ul.megamenu a.mm-item-link-hover:visited {
 
-
  color: #444;
 
-
  background: #FFF;
 
-
  border-top: 1px solid #777;
 
-
  border-left: 1px solid #777;
 
-
  border-right: 1px solid #777;
 
-
  -moz-border-radius: 3px 3px 0px 0px;
 
-
  border-radius: 3px 3px 0px 0px;
 
}
}
-
ul.megamenu div.mm-item-content {
+
.header-title-top{
-
  background: #FFF;
+
    height:50px;
-
  padding: 0px;
+
    margin:40px 0 20px;
-
  position: absolute;
+
    font-size:30px;
-
  border: 1px solid #777;
+
-
  z-index: 9;
+
}
}
-
.mm-content-base {
+
.header-title-bottom {
-
  background: #FFF;
+
    height:100px;
-
  position: relative;
+
    font-size:45px;
-
  z-index: 11;
+
-
  padding: 10px;
+
}
}
-
.mm-js-shadow {
 
-
  background: #555;
 
-
  position: absolute;
 
-
  z-index: 10;
 
-
}
 
-
 
-
<!-- megamenu end-->
 
</style>
</style>
</html>
</html>

Latest revision as of 14:00, 17 October 2014

Retrieved from "http://2014.igem.org/Template:Team:HokkaidoU_Japan/Top_Header/CSS"