Template:Team:Rutgers/menu

From 2011.igem.org

(Difference between revisions)
m
m
 
(11 intermediate revisions not shown)
Line 2: Line 2:
<head>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
-
<style type="text/css">
 
-
#wikiwrapper {
 
-
margin: 0px;
 
-
height: 251px;
 
-
background: url(https://static.igem.org/mediawiki/2010/f/f4/Yale_header-bg.png) repeat-x;
 
-
}
 
-
#wikiheader {
 
-
font-family: Helvetica, sans-serif;
 
-
background: url(https://static.igem.org/mediawiki/2010/1/13/Yale_header-img.png) center no-repeat;
 
-
height: 251px;
 
-
}
 
-
 
-
table {
 
-
    background: transparent;
 
-
}
 
-
 
-
 
-
/* Wiki Hacks - START */
 
-
/* Author: Pieter van Boheemen */
 
-
/* Team: TU Delft */
 
-
 
-
#globalWrapper { background-color: transparent; border: none; margin: 0; padding: 0; width: 100%; height:100%;}
 
-
#content { background-color: transparent; border: none; padding: 0; margin: 0; width: 100%; overflow: hidden; height:100%;}
 
-
 
-
#bodyContent { background-color: transparent; border: none; padding:0; margin:0; width:100%; height:100%;}
 
-
#top-section { height: 15px; margin: 0px; margin-left: auto; margin-right: auto; margin-bottom: 0 !important;
 
-
padding:0; border: none; font-size: 10px; background-color: transparent;}
 
-
 
-
#p-logo { height:1px; overflow:hidden; display: none;}
 
-
#search-controls { overflow:hidden; display:block; background-color: transparent; position: absolute; top: 100px; right: 40px;}
 
-
 
-
.left-menu { width: 500px !important; display:block; margin-top:-80px; border: none; text-align: right;}
 
-
.left-menu ul { border: none; }
 
-
#menubar.right-menu { width:300px; display:block; float:left; margin-top:-80px; border: none;}
 
-
.right-menu ul { border: none; width: 300px;}
 
-
 
-
 
-
#footer-box { background-color: transparent; width: 100%; margin: -10px auto 0 auto; padding: 20px 0;}
 
-
.visualClear { display: none; }
 
-
#footer { border: none; width: 965px; margin: 0 auto; padding: 0;}
 
-
.firstHeading { display: none;}
 
-
 
-
 
-
#f-list a { color: #333; font-size: 10px;}
 
-
#f-list a:hover { color: #666;}
 
-
.printfooter { display: none; }
 
-
#footer ul { margin: 0; padding: 0;}
 
-
#footer ul li { margin-top: 0; margin-bottom: 0; margin-left: 10px; margin-right: 10px; padding: 0;}
 
-
#search-controls { display:none; }
 
-
 
-
h3#siteSub { display: none;}
 
-
#contentSub {display: none;}
 
-
p:first-child { display: none;}
 
-
/* Wiki Hacks - END */
 
-
 
-
 
-
 
-
 
body, ul, li {
body, ul, li {
Line 66: Line 8:
line-height:21px;
line-height:21px;
text-align:left;
text-align:left;
 +
}
 +
 +
table {
 +
    background: transparent;
}
}
Line 173: Line 119:
/* Rounded Corners */
/* Rounded Corners */
-
-moz-border-radius: 10px;
+
-moz-border-radius: 0px;
-
-webkit-border-radius: 10px;
+
-webkit-border-radius: 0px;
-
border-radius: 10px;
+
border-radius: 0px;
/* Background color and gradients */
/* Background color and gradients */
Line 185: Line 131:
/* Borders */
/* Borders */
-
border: 1px solid #002232;
+
border: 1px solid #000000;
-moz-box-shadow:inset 0px 0px 1px #edf9ff;
-moz-box-shadow:inset 0px 0px 1px #edf9ff;
Line 251: Line 197:
   background: #999999;
   background: #999999;
   }
   }
-
 
-
.orange {
 
-
color: #000000;
 
-
border: solid 0px #000000;
 
-
background: #f78d1d;
 
-
background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#C0C0C0));
 
-
background: -moz-linear-gradient(top,  #FFFFFF,  #C0C0C0);
 
-
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#C0C0C0');
 
-
}
 
-
.orange:hover {
 
-
background: #f47c20;
 
-
background: -webkit-gradient(linear, left top, left bottom, from(#f88e11), to(#f06015));
 
-
background: -moz-linear-gradient(top,  #f88e11,  #f06015);
 
-
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f88e11', endColorstr='#f06015');
 
-
}
 
-
.orange:active {
 
-
color: #fcd3a5;
 
-
background: -webkit-gradient(linear, left top, left bottom, from(#f47a20), to(#faa51a));
 
-
background: -moz-linear-gradient(top,  #f47a20,  #faa51a);
 
-
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f47a20', endColorstr='#faa51a');
 
-
}
 
-
 
3D {
3D {
Line 329: Line 253:
/* Gradient background */
/* Gradient background */
background:#F4F4F4;
background:#F4F4F4;
-
background: -moz-linear-gradient(top, #EEEEEE, #BBBBBB);
+
background: -moz-linear-gradient(top, #CCCCCC, #f1f1f1);
-
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EEEEEE), to(#BBBBBB));
+
background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#CCCCCC), to(#f1f1f1));
/* Rounded Corners */
/* Rounded Corners */
Line 415: Line 339:
#menu li:hover div a {
#menu li:hover div a {
font-size:12px;
font-size:12px;
-
color:#015b86;
+
color:#333333;
}
}
#menu li:hover div a:hover {
#menu li:hover div a:hover {
-
color:#029feb;
+
color:#666666;
}
}
Line 633: Line 557:
text-align: center;
text-align: center;
}
}
-
/* Reset */
 
-
 
-
 
-
/* Showcase
 
-
-------------*/
 
-
 
-
#awOnePageButton .view-slide
 
-
{
 
-
display: none;
 
-
}
 
-
 
-
/* This class is removed after the showcase is loaded */
 
-
/* Assign the correct showcase height to prevent loading jumps in IE */
 
-
.showcase-load
 
-
{
 
-
height: 470px; /* Same as showcase javascript option */
 
-
overflow: hidden;
 
-
}
 
-
 
-
/* Container when content is shown as one page */
 
-
.showcase-onepage
 
-
{
 
-
/**/
 
-
}
 
-
 
-
/* Container when content is shown in slider */
 
-
.showcase
 
-
{
 
-
position: relative;
 
-
margin: auto;
 
-
}
 
-
 
-
.showcase-content-container
 
-
{
 
-
background-color: #000;
 
-
}
 
-
 
-
/* Navigation arrows */
 
-
.showcase-arrow-previous, .showcase-arrow-next
 
-
{
 
-
position: absolute;
 
-
background: url('https://static.igem.org/mediawiki/2011/f/f0/Arrows.png');
 
-
width: 33px;
 
-
height: 33px;
 
-
top: 220px;
 
-
cursor: pointer;
 
-
}
 
-
 
-
.showcase-arrow-previous
 
-
{
 
-
left: -60px;
 
-
}
 
-
 
-
.showcase-arrow-previous:hover
 
-
{
 
-
background-position: 0px -34px;
 
-
}
 
-
 
-
.showcase-arrow-next
 
-
{
 
-
right: -56px;
 
-
background-position: -34px 0;
 
-
}
 
-
 
-
.showcase-arrow-next:hover
 
-
{
 
-
background-position: -34px -34px;
 
-
}
 
-
 
-
/* Content */
 
-
.showcase-content
 
-
{
 
-
background-color: #DDD;
 
-
text-align: center;
 
-
}
 
-
 
-
.showcase-content-wrapper
 
-
{
 
-
text-align: center;
 
-
height: 600px;
 
-
width: 800px;
 
-
display: table-cell;
 
-
vertical-align: middle;
 
-
}
 
-
 
-
/* Styling the tooltips */
 
-
.showcase-plus-anchor
 
-
{
 
-
background-image: url('plus.png');
 
-
background-repeat: no-repeat;
 
-
}
 
-
 
-
.showcase-plus-anchor:hover
 
-
{
 
-
background-position: -32px 0;
 
-
}
 
-
 
-
div.showcase-tooltip
 
-
{
 
-
background-color: #fff;
 
-
color: #000;
 
-
text-align: left;
 
-
padding: 5px 8px;
 
-
background-image: url(../images/white-opacity-80.png);
 
-
}
 
-
 
-
/* Styling the caption */
 
-
.showcase-caption
 
-
{
 
-
color: #000;
 
-
padding: 8px 15px;
 
-
text-align: left;
 
-
position: absolute;
 
-
bottom: 10px; left: 10px; right: 10px;
 
-
display: none;
 
-
background-image: url(../images/white-opacity-80.png);
 
-
}
 
-
 
-
.showcase-onepage .showcase-content
 
-
{
 
-
margin-bottom: 10px;
 
-
}
 
-
 
-
/* Button Wrapper */
 
-
.showcase-button-wrapper
 
-
{
 
-
clear: both;
 
-
margin-top: 10px;
 
-
text-align: center;
 
-
}
 
-
 
-
.showcase-button-wrapper span
 
-
{
 
-
margin-right: 3px;
 
-
padding: 2px 5px 0px 5px;
 
-
cursor: pointer;
 
-
font-size: 12px;
 
-
color: #444444;
 
-
}
 
-
 
-
.showcase-button-wrapper span.active
 
-
{
 
-
color: #fff;
 
-
}
 
-
 
-
/* Thumbnails */
 
-
.showcase-thumbnail-container /* Used for backgrounds, no other styling!!! */
 
-
{
 
-
background-color: #000;
 
-
}
 
-
 
-
.showcase-thumbnail-wrapper
 
-
{
 
-
overflow: hidden;
 
-
}
 
-
 
-
.showcase-thumbnail
 
-
{
 
-
width: 120px;
 
-
height: 90px;
 
-
cursor: pointer;
 
-
border: solid 1px #333;
 
-
position: relative;
 
-
}
 
-
 
-
.showcase-thumbnail-caption
 
-
{
 
-
position: absolute;
 
-
bottom: 2px;
 
-
padding-left: 10px;
 
-
padding-bottom: 5px;
 
-
}
 
-
 
-
.showcase-thumbnail-content
 
-
{
 
-
padding: 10px;
 
-
text-align: center;
 
-
padding-top: 25px;
 
-
}
 
-
 
-
.showcase-thumbnail-cover
 
-
{
 
-
background-image: url(../images/black-opacity-40.png);
 
-
position: absolute;
 
-
top: 0; bottom: 0; left: 0; right: 0;
 
-
}
 
-
 
-
.showcase-thumbnail:hover
 
-
{
 
-
border: solid 1px #999;
 
-
}
 
-
 
-
.showcase-thumbnail:hover .showcase-thumbnail-cover
 
-
{
 
-
display: none;
 
-
}
 
-
 
-
.showcase-thumbnail.active
 
-
{
 
-
border: solid 1px #999;
 
-
}
 
-
 
-
.showcase-thumbnail.active .showcase-thumbnail-cover
 
-
{
 
-
display: none;
 
-
}
 
-
 
-
.showcase-thumbnail-wrapper-horizontal
 
-
{
 
-
padding: 10px;
 
-
}
 
-
 
-
.showcase-thumbnail-wrapper-horizontal .showcase-thumbnail
 
-
{
 
-
margin-right: 10px;
 
-
width: 116px;
 
-
}
 
-
 
-
.showcase-thumbnail-wrapper-vertical
 
-
{
 
-
padding: 10px;
 
-
}
 
-
 
-
.showcase-thumbnail-wrapper-vertical .showcase-thumbnail
 
-
{
 
-
margin-bottom: 10px;
 
-
}
 
-
 
-
.showcase-thumbnail-button-backward,
 
-
.showcase-thumbnail-button-forward
 
-
{
 
-
padding: 7px;
 
-
cursor: pointer;
 
-
}
 
-
 
-
.showcase-thumbnail-button-backward
 
-
{
 
-
padding-bottom: 0px;
 
-
padding-right: 0px;
 
-
}
 
-
 
-
.showcase-thumbnail-button-backward .showcase-thumbnail-vertical,
 
-
.showcase-thumbnail-button-forward .showcase-thumbnail-vertical,
 
-
.showcase-thumbnail-button-forward .showcase-thumbnail-horizontal,
 
-
.showcase-thumbnail-button-backward .showcase-thumbnail-horizontal
 
-
{
 
-
background-image: url(../images/arrows-small.png);
 
-
background-repeat: no-repeat;
 
-
display: block;
 
-
width: 17px;
 
-
height: 17px;
 
-
}
 
-
 
-
.showcase-thumbnail-button-backward .showcase-thumbnail-vertical
 
-
{
 
-
background-position: 0 -51px;
 
-
margin-left: 55px;
 
-
}
 
-
.showcase-thumbnail-button-backward:hover .showcase-thumbnail-vertical
 
-
{
 
-
background-position: -17px -51px;
 
-
}
 
-
 
-
.showcase-thumbnail-button-forward .showcase-thumbnail-vertical
 
-
{
 
-
background-position: 0 -34px;
 
-
margin-left: 55px;
 
-
}
 
-
.showcase-thumbnail-button-forward:hover .showcase-thumbnail-vertical
 
-
{
 
-
background-position: -17px -34px;
 
-
}
 
-
 
-
.showcase-thumbnail-button-backward .showcase-thumbnail-horizontal
 
-
{
 
-
background-position: 0 -17px;
 
-
margin-top: 40px;
 
-
margin-bottom: 40px;
 
-
}
 
-
.showcase-thumbnail-button-backward:hover .showcase-thumbnail-horizontal
 
-
{
 
-
background-position: -17px -17px;
 
-
}
 
-
 
-
.showcase-thumbnail-button-forward .showcase-thumbnail-horizontal
 
-
{
 
-
background-position: 0 0;
 
-
margin-top: 40px;
 
-
margin-bottom: 40px;
 
-
}
 
-
.showcase-thumbnail-button-forward:hover .showcase-thumbnail-horizontal
 
-
{
 
-
background-position: -17px 0;
 
-
}
 
-
 
-
/* Hide button text */
 
-
.showcase-thumbnail-button-forward span span,
 
-
.showcase-thumbnail-button-backward span span
 
-
{
 
-
display: none;
 
-
}
 
-
 
-
 
-
 
-
/* Clear (used for horizontal thumbnails)
 
-
-------------------------------------------*/
 
-
 
-
.clear
 
-
{
 
-
clear: both;
 
-
display: block;
 
-
overflow: hidden;
 
-
visibility: hidden;
 
-
width: 0;
 
-
height: 0;
 
-
float: none;
 
-
}
 
-
 
-
</style>
 
</html>
</html>

Latest revision as of 03:23, 29 September 2011

body, ul, li { font-size:16px; font-family:Arial, Helvetica, sans-serif; line-height:21px; text-align:left; } table { background: transparent; } .imgshadow2 blockquote p { font-size: 16px; font-family: Arial, Helvetica, sans-serif; text-align: left; color: #333; } .imgshadow2 blockquote table tr td { font-family: Arial, Helvetica, sans-serif; font-size: 16px; line-height: normal; color: #222; text-align: left; } .imgshadow2 blockquote table { font-size: 14px; text-align: center; } h3 { font-size:14px; font-family: Arial, Helvetica, sans-serif; color: #333; } h4 { font-size:20px; font-family: Arial, Helvetica, sans-serif; color: #333; line-height:11px; } h1 { font-size:33px; font-family: Arial, Helvetica, sans-serif; color: #333; } h2 { font-size:25px; font-weight:400; letter-spacing:-1px; margin:4px 0 4px 0; padding-bottom:4px; /*border-bottom:1px solid #666666;*/ text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 2px 2px rgba(0,0,0,.15); color: #505454; text-align: left; } .shadow { color: #252525; font: bold Helvetica, Arial, Sans-Serif; text-shadow: 1px 1px #FFFFFF, 2px 2px #ebebeb, 3px 3px #cdcdcd; /*line-height: .8; */ text-transform: uppercase; line-height:30px; } .shadow:hover { position: relative; top: -3px; left: 5px; text-shadow: 1px 1px #FFFFFF, 2px 2px #f0ebd1, 3px 3px #f0ebd1, 4px 4px #f0ebd1, 5px 5px #f15922, 6px 6px #f15922; color: #00aeef; text-align: left; } .stuff { font-family: arial,sans-serif; font-size: 16px; letter-spacing: .2pt; word-spacing: 2pt; line-height: 1.4; text-align: left; } #menu { list-style:none; width:1000px; margin:0px auto 0px auto; height:45px; padding:0px 20px 0px 20px; /* Rounded Corners */ -moz-border-radius: 0px; -webkit-border-radius: 0px; border-radius: 0px; /* Background color and gradients */ background: #666666; background: -moz-linear-gradient(top, #666666, #000000); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#666666), to(#000000)); /* Borders */ border: 1px solid #000000; -moz-box-shadow:inset 0px 0px 1px #edf9ff; -webkit-box-shadow:inset 0px 0px 1px #edf9ff; box-shadow:inset 0px 0px 1px #edf9ff; } #menu li { float:left; display:block; text-align:center; position:relative; padding: 4px 10px 4px 10px; margin-right:30px; margin-top:7px; border:none; } #menu li:hover { border: 1px solid #777777; padding: 4px 9px 4px 9px; /* Background color and gradients */ background: #F4F4F4; background: -moz-linear-gradient(top, #F4F4F4, #EEEEEE); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#F4F4F4), to(#EEEEEE)); /* Rounded corners */ -moz-border-radius: 5px 5px 0px 0px; -webkit-border-radius: 5px 5px 0px 0px; border-radius: 5px 5px 0px 0px; } .button { border-top: 1px solid #ebebeb; background: #ffffff; background: -webkit-gradient(linear, left top, left bottom, from(#cccccc), to(#ffffff)); background: -webkit-linear-gradient(top, #cccccc, #ffffff); background: -moz-linear-gradient(top, #cccccc, #ffffff); background: -ms-linear-gradient(top, #cccccc, #ffffff); background: -o-linear-gradient(top, #cccccc, #ffffff); padding: 6.5px 13px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0; -moz-box-shadow: rgba(0,0,0,1) 0 1px 0; box-shadow: rgba(0,0,0,1) 0 1px 0; text-shadow: rgba(0,0,0,.4) 0 1px 0; color: #303030; font-size: 12px; font-family: Helvetica, Arial, Sans-Serif; text-decoration: none; vertical-align: middle; } .button:hover { border-top-color: #ffffff; background: #ffffff; color: #ccc; } .button:active { border-top-color: #999999; background: #999999; } 3D { text-shadow: 0 1px 0 #ccc, 0 2px 0 #c9c9c9, 0 3px 0 #bbb, 0 4px 0 #b9b9b9, 0 5px 0 #aaa, 0 6px 1px rgba(0,0,0,.1), 0 0 5px rgba(0,0,0,.1), 0 1px 3px rgba(0,0,0,.3), 0 3px 5px rgba(0,0,0,.2), 0 5px 10px rgba(0,0,0,.25), 0 10px 10px rgba(0,0,0,.2), 0 20px 20px rgba(0,0,0,.15); } #menu li a { font-family:Arial, Helvetica, sans-serif; font-size:14px; color: #EEEEEE; display:block; outline:0; text-decoration:none; text-shadow: 1px 1px 1px #000; } #menu li:hover a { color:#161616; text-shadow: 1px 1px 1px #ffffff; } #menu li .drop { padding-right:21px; background:url("img/drop.png") no-repeat right 8px; } #menu li:hover .drop { background:url("img/drop.png") no-repeat right 7px; font-size: 18px; } .dropdown_1column, .dropdown_2columns, .dropdown_3columns, .dropdown_4columns, .dropdown_5columns { margin:4px auto; float:left; position:absolute; left:-999em; /* Hides the drop down */ text-align:left; padding:10px 5px 10px 5px; border:1px solid #777777; border-top:none; /* Gradient background */ background:#F4F4F4; background: -moz-linear-gradient(top, #CCCCCC, #f1f1f1); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#CCCCCC), to(#f1f1f1)); /* Rounded Corners */ -moz-border-radius: 0px 5px 5px 5px; -webkit-border-radius: 0px 5px 5px 5px; border-radius: 0px 5px 5px 5px; } .dropdown_1column {width: 140px;} .dropdown_2columns {width: 280px;} .dropdown_3columns {width: 420px;} .dropdown_4columns {width: 560px;} .dropdown_5columns {width: 700px;} #menu li:hover .dropdown_1column, #menu li:hover .dropdown_2columns, #menu li:hover .dropdown_3columns, #menu li:hover .dropdown_4columns, #menu li:hover .dropdown_5columns { left:-1px; top:auto; } .col_1, .col_2, .col_3, .col_4, .col_5 { display:inline; float: left; position: relative; margin-left: 5px; margin-right: 5px; } .col_1 {width:130px;} .col_2 {width:270px;} .col_3 {width:410px;} .col_4 {width:550px;} .col_5 {width:690px;} #menu .menu_right { float:right; margin-right:0px; } #menu li .align_right { /* Rounded Corners */ -moz-border-radius: 5px 0px 5px 5px; -webkit-border-radius: 5px 0px 5px 5px; border-radius: 5px 0px 5px 5px; } #menu li:hover .align_right { left:auto; right:-1px; top:auto; } #menu p, #menu h2, #menu h3, #menu ul li { font-family:Arial, Helvetica, sans-serif; line-height:21px; font-size:12px; text-align:left; text-shadow: 1px 1px 1px #FFFFFF; } #menu h2 { font-size:21px; font-weight:400; letter-spacing:-1px; margin:7px 0 14px 0; padding-bottom:14px; border-bottom:1px solid #666666; } #menu h3 { font-size:14px; margin:0px 0 0px 0; padding-bottom:0px; border-bottom:1px solid #888888; } #menu p { line-height:18px; margin:0 0 10px 0; } #menu li:hover div a { font-size:12px; color:#333333; } #menu li:hover div a:hover { color:#666666; } .strong { font-weight:bold; } .italic { font-style:italic; } .imgshadow { /* Better style on light background */ background:#FFFFFF; padding:4px; border:1px solid #777777; margin-top:5px; -moz-box-shadow:0px 0px 5px #666666; -webkit-box-shadow:0px 0px 5px #666666; box-shadow:0px 0px 5px #666666; } .imgshadow2 { /* Better style on light background */ background:#ffffff; padding:4px; border:1px solid #777777; margin-top:5px; -moz-box-shadow:0px 3px 5px #666666; -webkit-box-shadow:0px 3px 5px #666666; box-shadow:0px 3px 5px #666666; /* Rounded Corners */ -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; text-align: center; } .imgshadow3 { /* Better style on light background */ background:#c0c0c0; /* Gradient background */ background:#F4F4F4; background: -moz-linear-gradient(top, #EEEEEE, #BBBBBB); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EEEEEE), to(#BBBBBB)); padding:4px; border:1px solid #777777; margin-top:5px; -moz-box-shadow:0px 3px 5px #666666; -webkit-box-shadow:0px 3px 5px #666666; box-shadow:0px 3px 5px #666666; /* Rounded Corners */ -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .imgshadow0 { /* Better style on light background */ background:#999999; /* Gradient background */ background:#eeeeee; background: -moz-linear-gradient(top, #EEEEEE, #BBBBBB); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EEEEEE), to(#BBBBBB)); padding:0px; border:1px solid #777777; margin-top:5px; -moz-box-shadow:0px 3px 5px #666666; -webkit-box-shadow:0px 3px 5px #666666; box-shadow:0px 3px 5px #666666; /* Rounded Corners */ -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .imgshadoweas { /* Better style on light background */ background:#c0c0c0; /* Gradient background */ background:#F4F4F4; background: -moz-linear-gradient(top, #c0c0c0, #FFFFFF); background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#c0c0c0), to(#FFFFFF)); padding:4px; border:1px solid #777777; margin-top:5px; -moz-box-shadow:0px 3px 5px #666666; -webkit-box-shadow:0px 3px 5px #666666; box-shadow:0px 3px 5px #666666; /* Rounded Corners */ -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; } .img_left { /* Image sticks to the left */ width:auto; float:left; margin:5px 15px 5px 5px; } #menu li .black_box { background-color:#333333; color: #eeeeee; text-shadow: 1px 1px 1px #000; padding:4px 6px 4px 6px; /* Rounded Corners */ -moz-border-radius: 5px; -webkit-border-radius: 5px; border-radius: 5px; /* Shadow */ -webkit-box-shadow:inset 0 0 3px #000000; -moz-box-shadow:inset 0 0 3px #000000; box-shadow:inset 0 0 3px #000000; } #menu li ul { list-style:none; padding:0; margin:0 0 12px 0; } #menu li ul li { font-size:12px; line-height:24px; position:relative; text-shadow: 1px 1px 1px #ffffff; padding:0; margin:0; float:none; text-align:left; width:130px; } #menu li ul li:hover { background:none; border:none; padding:0; margin:0; } #menu li .greybox li { background:#F4F4F4; border:1px solid #bbbbbb; margin:0px 0px 4px 0px; padding:4px 6px 4px 6px; width:116px; /* Rounded Corners */ -moz-border-radius: 5px; -webkit-border-radius: 5px; -khtml-border-radius: 5px; border-radius: 5px; } #menu li .greybox li:hover { background:#ffffff; border:1px solid #aaaaaa; padding:4px 6px 4px 6px; margin:0px 0px 4px 0px; } .notice-wrap { position: fixed; top: 20px; right: 20px; width: 250px; } * html .notice-wrap { position: absolute; } .notice-item { height: 60px; background: #333; -moz-border-radius: 6px; -webkit-border-radius: 6px; color: #eee; padding: 6px 6px 0 6px; font-family: lucida Grande; font-size: 11px; border: 2px solid #999; display: block; position: relative; margin: 0 0 12px 0; } .notice-item-close { position: absolute; font-family: Arial; font-size: 12px; font-weight: bold; right: 6px; top: 6px; cursor: pointer; } /* IE10 */ background-image: -ms-radial-gradient(left bottom, ellipse farthest-corner, #FFFFFF 0%, #DEDEDE 100%); /* Mozilla Firefox */ background-image: -moz-radial-gradient(left bottom, ellipse farthest-corner, #FFFFFF 0%, #DEDEDE 100%); /* Opera */ background-image: -o-radial-gradient(left bottom, ellipse farthest-corner, #FFFFFF 0%, #DEDEDE 100%); /* Webkit (Safari/Chrome 10) */ background-image: -webkit-gradient(radial, left bottom, 0, left bottom, 1020, color-stop(0, #FFFFFF), color-stop(1, #DEDEDE)); /* Webkit (Chrome 11+) */ background-image: -webkit-radial-gradient(left bottom, ellipse farthest-corner, #FFFFFF 0%, #DEDEDE 100%); /* Proposed W3C Markup */ background-image: radial-gradient(left bottom, ellipse farthest-corner, #FFFFFF 0%, #DEDEDE 100%); .footer2 { text-align: center; }