Template:Team:HokkaidoU Japan/header/css

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
-
<html><style type="text/css">
 
/* Mega Menu Styles */
/* Mega Menu Styles */
.mega-menu ul,
.mega-menu ul,
Line 150: Line 149:
   background: #efefef url(images/arrow_on.png) no-repeat 7px 10px;
   background: #efefef url(images/arrow_on.png) no-repeat 7px 10px;
}
}
-
/* Page */
+
#background {
-
body,html,div,blockquote,img,label,p,h1,h2,h3,h4,h5,h6,pre,ul,ol,li,dl,dt,dd,form,a,fieldset,input,th,td{border:0;outline:none;margin:0;padding:0;}
+
-
ul{list-style:none;}
+
-
 
+
-
body {font: normal 13px Arial, sans-serif;}
+
-
h2 {font: normal 26px Arial, sans-serif; padding: 20px 0; margin: 0 0 30px 0;}
+
-
.wrap {width: 960px; margin: 0 auto;}
+
-
.demo-container {padding: 20px 0;}
+
-
.demo-container h4 {font-size: 14px; margin: 0 0 5px 0;}
+
-
 
+
-
/* Mega Menu Styles */
+
-
.mega-menu ul, .mega-menu ul li {list-style: none;}
+
-
.mega-menu ul {position: relative; padding: 0; margin: 0;}
+
-
.mega-menu ul li ul {display: none;}
+
-
.mega-menu .sub {display: none;}
+
-
.mega-menu .sub ul {display: block;}
+
-
 
+
-
#mega-menu-1 {
+
-
font: normal 13px Arial, sans-serif;
+
-
list-style: none;
+
-
position: relative;
+
-
padding: 0;
+
-
margin: 0;
+
-
}
+
-
#mega-menu-1 .sub ul {
+
-
display: block;
+
-
}
+
-
#mega-menu-1 {
+
-
background: #222;
+
-
width: 100%;
+
-
height: 40px;
+
-
position: relative;
+
-
}
+
-
#mega-menu-1 li {
+
-
float: left;
+
-
margin: 0;
+
-
padding: 0;
+
-
font-weight: bold;
+
-
}
+
-
#mega-menu-1 li a {
+
-
float: left;
+
-
display: block;
+
-
color: #fff;
+
-
padding: 12px 25px;
+
-
background: #222;
+
-
text-decoration: none;
+
-
}
+
-
#mega-menu-1 li.mega-hover a, #mega-menu-1 li.mega-hover a:hover {
+
-
background: #CCC;
+
-
color: #000;
+
-
}
+
-
#mega-menu-1 li a:hover {
+
-
background: #999;
+
-
color: #000;
+
-
}
+
-
#mega-menu-1 li .sub-container {
+
-
position: absolute;
+
-
}
+
-
#mega-menu-1 li .sub {
+
-
background: #efefef;
+
-
padding: 15px;
+
-
border: 1px solid #ccc;
+
-
}
+
-
#mega-menu-1 li .sub .row {
+
-
width: 100%;
+
-
overflow: hidden;
+
-
clear: both;
+
-
}
+
-
#mega-menu-1 li .sub li {
+
-
list-style: none;
+
-
float: none;
+
-
width: 170px;
+
-
font-size: 1em;
+
-
font-weight: normal;
+
-
}
+
-
#mega-menu-1 li .sub li.mega-hdr {
+
-
margin: 0 10px 10px 0;
+
-
float: left;
+
-
}
+
-
#mega-menu-1 li .sub li.mega-hdr.last {
+
-
margin-right: 0;
+
-
}
+
-
#mega-menu-1 li .sub a {
+
-
background: none;
+
-
color: #111;
+
-
padding: 7px 10px;
+
-
display: block;
+
-
float: none;
+
-
font-size: 0.9em;
+
-
}
+
-
#mega-menu-1 li .sub li.mega-hdr a.mega-hdr-a {
+
-
padding: 5px 15px;
+
-
margin-bottom: 5px;
+
-
background: #6B6B6B;
+
-
text-transform: uppercase;
+
-
font-weight: bold;
+
-
color: #fff;
+
-
}
+
-
#mega-menu-1 li .sub li.mega-hdr a.mega-hdr-a:hover {
+
-
color: #000;
+
-
}
+
-
#mega-menu-1 .sub li.mega-hdr li a {
+
-
padding: 4px 5px;
+
-
font-weight: normal;
+
-
}
+
-
#mega-menu-1 .sub li.mega-hdr li a:hover {
+
-
color: #a32403;
+
-
background: #efefef;
+
-
}
+
-
#mega-menu-1 .sub ul li {
+
-
padding-right: 0;
+
-
}
+
-
#mega-menu-1 li .sub-container.non-mega .sub {
+
-
padding: 10px;
+
-
}
+
-
#mega-menu-1 li .sub-container.non-mega li {
+
-
padding: 0;
+
-
width: 190px;
+
-
margin: 0;
+
-
}
+
-
#mega-menu-1 li .sub-container.non-mega li a {
+
-
padding: 7px 5px 7px 22px;
+
-
}
+
-
#mega-menu-1 li .sub-container.non-mega li a:hover {
+
-
color: #a32403;
+
-
background: #efefef;
+
-
}#background {
+
   position: absolute;
   position: absolute;
   top: 0;
   top: 0;
Line 423: Line 296:
   display: none;
   display: none;
}
}
-
 
-
</style></html>
 

Revision as of 15:12, 18 September 2013

/* Mega Menu Styles */ .mega-menu ul, .mega-menu ul li {

 list-style: none;

} .mega-menu ul {

 position: relative;
 padding: 0;
 margin: 0;

} .mega-menu ul li ul {

 display: none;

} .mega-menu .sub {

 display: none;

} .mega-menu .sub ul {

 display: block;

}

ul.mega-menu {

 position: relative;
 width: 100%;
 height: 40px;
 margin: 0;
 padding: 0;
 border: none;
 background: #ccc;

} ul.mega-menu li {

 float: left;
 margin: 0;
 padding: 0;
 font-size: 13px;
 font-weight: bold;

} ul.mega-menu li a {

 float: left;
 display: block;
 color: #000;
 padding: 12px 38px 12px 25px;
 background: url(images/bg_white.png) repeat-x 100% 0;
 text-shadow: 1px 1px 1px #fff;
 text-decoration: none;

} ul.mega-menu li a.dc-mega {

 position: relative;

} ul.mega-menu li a .dc-mega-icon {

 display: block;
 position: absolute;
 width: 8px;
 height: 6px;
 top: 18px;
 right: 15px;
 background: url(images/arrow.png) no-repeat 0 100%;

} ul.mega-menu li.mega-hover a, .white ul.mega-menu li a:hover {

 background-position: 100% -40px;
 color: #000;
 text-shadow: none;

} ul.mega-menu li.mega-hover a .dc-mega-icon {

 background-position: 0 100%;

} ul.mega-menu li .sub-container {

 position: absolute;
 background: url(images/bg_sub_left.png) no-repeat 0 100%;
 padding-left: 20px;
 margin-left: -3px;

} ul.mega-menu li .sub {

 background: url(images/bg_sub.png) no-repeat 100% 100%;
 padding: 20px 20px 20px 10px;

} ul.mega-menu li .sub-container.mega .sub {

 padding: 20px 20px 10px 0;

} ul.mega-menu li .sub .row {

 width: 100%;
 overflow: hidden;
 clear: both;

} ul.mega-menu li .sub li {

 list-style: none;
 float: none;
 width: 170px;
 font-size: 1em;
 font-weight: normal;

} ul.mega-menu li .sub li.mega-hdr {

 margin: 0 10px 10px 0;
 float: left;

} ul.mega-menu li .sub li.mega-hdr.last {

 margin-right: 0;

} ul.mega-menu li .sub a {

 background: none;
 border: none;
 text-shadow: none;
 color: #111;
 padding: 7px 10px;
 display: block;
 float: none;
 text-decoration: none;
 font-size: 0.9em;

} ul.mega-menu li .sub li.mega-hdr a.mega-hdr-a {

 padding: 5px 5px 5px 15px;
 margin-bottom: 5px;
 background: #E3E3E3 url(images/bg_mega_hdr.png) no-repeat 0 0;
 text-transform: uppercase;
 font-weight: bold;
 color: #000;
 text-shadow: 1px 1px 1px #fff;

} ul.mega-menu li .sub li.mega-hdr a.mega-hdr-a:hover {

 color: #a32403;
 text-shadow: none;

} ul.mega-menu .sub li.mega-hdr li a {

 padding: 4px 5px 4px 20px;
 background: url(images/arrow_off.png) no-repeat 5px 8px;
 font-weight: normal;

} ul.mega-menu .sub li.mega-hdr li a:hover {

 color: #a32403;
 background: #efefef url(images/arrow_on.png) no-repeat 5px 8px;

} ul.mega-menu .sub ul li {

 padding-right: 0;

} ul.mega-menu li .sub-container.non-mega .sub {

 padding: 20px 20px 20px 0;

} ul.mega-menu li .sub-container.non-mega li {

 padding: 0;
 width: 190px;
 margin: 0;

} ul.mega-menu li .sub-container.non-mega li a {

 padding: 7px 5px 7px 22px;
 background: url(images/arrow_off.png) no-repeat 7px 10px;

} ul.mega-menu li .sub-container.non-mega li a:hover {

 color: #a32403;
 background: #efefef url(images/arrow_on.png) no-repeat 7px 10px;

}

  1. background {
 position: absolute;
 top: 0;
 width: 100%;
 margin: 0;
 padding: 0;

}

  1. wrapper {
 width: 960px;
 margin: 0 auto 0;

}

img {

 display: none;

} html {

 overflow-y: scroll;

}

body {

 font-size: 14px;

}

  1. top-section {
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 0;
 margin: 0;
 padding: 0;
 border: none;
 z-index: 100;

}

  1. open-wiki-menu {
 display: block;
 width: 75px;
 margin: 15px;
 padding: 5px;
 text-align: center;
 border: 1px solid #000000;
 border-radius: 5px;

}

  1. wiki-menu {
 display: none;
 position: relative;
 width: 120px;
 margin: 15px;
 padding: 15px;
 border: 1px solid #000000;
 border-radius: 10px;

}

  1. wiki-menu h2 {
 line-height: 20px;
 font-size: 16px;
 border: none;

}

  1. wiki-menu h2:first-child {
 padding-top: 0;

}

  1. menubar {
 position: static;
 width: 90px;
 overflow-x: hidden;
 margin: 0;
 padding: 0;
 background: #ffffff;
 font-size: 12px;

}

  1. menubar li {
 display: block;
 margin: 0;
 padding: 0;
 text-align: left;

}

  1. menubar li a {
 color: #000000;
 background: inherit;

}

  1. menubar.left-menu li:last-child {
 display: none;

}

  1. close-wiki-menu {
 display: block;
 position: absolute;
 bottom: 15px;
 right: 15px;

} body {

 background: #ffffff;

}

  1. globalWrapper {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 0;
 margin: 0;
 padding: 0;
 border: 0;
 font-size: 100%;

}

  1. content {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 0;
 margin: 0;
 padding: 0;
 border: 0;
 font-size: 100%;

}

  1. bodyContent {
 position: absolute;
 top: 0;
 left: 0;
 width: 100%;
 height: 0;
 margin: 0;
 padding: 0;
 border: 0;
 font-size: 100%;

}

  1. p-logo {
 display: none;

}

  1. footer-box {
 display: none;

}

  1. catlinks {
 display: none;

}

.firstHeading {

 display: none;

}