Team:IIT Madras/Template:new home

From 2012.igem.org

(Difference between revisions)
(Created page with "<html> <head> <title>bar</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <style type="text/css"> <!-- html { overflow: -moz-scrollbars-vertical ...")
Line 354: Line 354:
#menu ul li{float:left; width:75px; text-align:center; background:url('https://static.igem.org/mediawiki/2011/1/1c/Test_menu.gif') repeat-x;margin:10px; height:34px; -moz-border-radius:5px; border-radius:5px; -webkit-border-radius:5px;}
#menu ul li{float:left; width:75px; text-align:center; background:url('https://static.igem.org/mediawiki/2011/1/1c/Test_menu.gif') repeat-x;margin:10px; height:34px; -moz-border-radius:5px; border-radius:5px; -webkit-border-radius:5px;}
#menu a {position : relative; top:7px; text-decoration:none; color:black;}  
#menu a {position : relative; top:7px; text-decoration:none; color:black;}  
 +
 +
 +
 +
#iitm_content{
 +
  position:relative;
 +
  top:-110px;
 +
}
 +
 +
/* Navigation Bar */
 +
 +
#iitm_menu {
 +
  list-style:none;
 +
  width:940px;
 +
  margin:30px auto 0px auto;
 +
  height:43px;
 +
  padding:0px 20px 0px 20px;
 +
 +
  /* Rounded Corners */
 +
 
 +
  -moz-border-radius: 10px;
 +
  -webkit-border-radius: 10px;
 +
  border-radius: 10px;
 +
 +
  /* Background color and gradients */
 +
 
 +
  background: #014464;
 +
  background: -moz-linear-gradient(top, #0272a7, #013953);
 +
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#0272a7), to(#013953));
 +
 
 +
  /* Borders */
 +
 
 +
  border: 1px solid #002232;
 +
 +
  -moz-box-shadow:inset 0px 0px 1px #edf9ff;
 +
  -webkit-box-shadow:inset 0px 0px 1px #edf9ff;
 +
  box-shadow:inset 0px 0px 1px #edf9ff;
 +
}
 +
 +
#iitm_menu li {
 +
  float:left;
 +
  text-align:center;
 +
  position:relative;
 +
  padding: 4px 10px 4px 10px;
 +
  margin-right:30px;
 +
  margin-top:7px;
 +
  border:none;
 +
}
 +
 +
#iitm_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;
 +
}
 +
 +
#iitm_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;
 +
}
 +
 +
#iitm_menu li:hover a {
 +
  color:#161616;
 +
  text-shadow: 1px 1px 1px #FFFFFF;
 +
}
 +
#iitm_menu li .drop {
 +
  padding-right:21px;
 +
  background:url("img/drop.png") no-repeat right 8px;
 +
}
 +
#iitm_menu li:hover .drop {
 +
  background:url("img/drop.png") no-repeat right 7px;
 +
}
 +
 +
/* Drop Down */
 +
 +
.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, #EEEEEE, #BBBBBB);
 +
  background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#EEEEEE), to(#BBBBBB));
 +
 +
  /* 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;}
 +
 +
#iitm_menu li:hover .dropdown_1column,
 +
#iitm_menu li:hover .dropdown_2columns,
 +
#iitm_menu li:hover .dropdown_3columns,
 +
#iitm_menu li:hover .dropdown_4columns,
 +
#iitm_menu li:hover .dropdown_5columns {
 +
  left:-1px;
 +
    top:auto;
 +
}
 +
 +
/* Columns */
 +
 +
.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;}
 +
 +
/* Right alignment */
 +
 +
#iitm_menu .menu_right {
 +
  float:right;
 +
  margin-right:0px;
 +
}
 +
#iitm_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;
 +
}
 +
#iitm_menu li:hover .align_right {
 +
  left:auto;
 +
  right:-1px;
 +
  top:auto;
 +
}
 +
 +
/* Drop Down Content Stylings */
 +
 +
#iitm_menu p, #iitm_menu h2, #iitm_menu h3, #iitm_menu ul li {
 +
  font-family:Arial, Helvetica, sans-serif;
 +
  line-height:21px;
 +
  font-size:12px;
 +
  text-align:left;
 +
  text-shadow: 1px 1px 1px #FFFFFF;
 +
}
 +
#iitm_menu h2 {
 +
  font-size:21px;
 +
  font-weight:400;
 +
  letter-spacing:-1px;
 +
  margin:7px 0 14px 0;
 +
  padding-bottom:14px;
 +
  border-bottom:1px solid #666666;
 +
}
 +
#iitm_menu h3 {
 +
  font-size:14px;
 +
  margin:7px 0 14px 0;
 +
  padding-bottom:7px;
 +
  border-bottom:1px solid #888888;
 +
}
 +
#iitm_menu p {
 +
  line-height:18px;
 +
  margin:0 0 10px 0;
 +
}
 +
 +
#iitm_menu li:hover div a {
 +
  font-size:12px;
 +
  color:#015b86;
 +
}
 +
#iitm_menu li:hover div a:hover {
 +
  color:#029feb;
 +
}
 +
.strong {
 +
  font-weight:bold;
 +
}
 +
.italic {
 +
  font-style:italic;
 +
}
 +
.imgshadow {
 +
  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;
 +
}
 +
.img_left { /* Image sticks to the left */
 +
  width:auto;
 +
  float:left;
 +
  margin:5px 15px 5px 5px;
 +
}
 +
#iitm_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;
 +
}
 +
#iitm_menu li ul {
 +
  list-style:none;
 +
  padding:0;
 +
  margin:0 0 12px 0;
 +
}
 +
#iitm_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;
 +
}
 +
#iitm_menu li ul li:hover {
 +
  background:none;
 +
  border:none;
 +
  padding:0;
 +
  margin:0;
 +
}
 +
#iitm_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;
 +
  border-radius: 5px;
 +
}
 +
#iitm_menu li .greybox li:hover {
 +
  background:#ffffff;
 +
  border:1px solid #aaaaaa;
 +
  padding:4px 6px 4px 6px;
 +
  margin:0px 0px 4px 0px;
 +
}
 +
-->
-->
 +
</style>
</style>
<!-- End Save for Web Styles -->
<!-- End Save for Web Styles -->

Revision as of 02:22, 29 August 2012

bar