View source for Team:IIT Delhi/team1

{{Template_All_Teams}}

<html>

<style>


/*--------------General end-----------------*/

/*--------------Global/content start----------------*/
#content { /*-- changes default wiki settings --*/
	width: 100%; 
	height: 100%;
	border: 0px;
	margin: 0px;
	padding: 0px;

}


/*--------------Global end------------------*/


body{
  margin:0;
  padding:0;
  background-image:url("https://static.igem.org/mediawiki/2015/6/67/IITDwikipages_background.jpg");
  background-size:100% 100%;
}


.icons{
  position:absolute;
  margin-top:1.5%;
  width:7%;
  padding-left:35px;
  -webkit-transition: all 1s ease;
  -moz-transition: all 1s ease;
  -o-transition: all 1s ease;
  transition all 1s ease;
}
.iconActive{
  width:14%;
  z-index:1;
  opacity:4;
}

#IITDigem_logo{
  position:absolute;
  margin-top:1%;
  margin-left:2%;
  width:17%;
}
#tour{
  position:absolute;
  margin-top:2%;
  margin-left:82.5%;
}
#leftNav{
  width:17%;
  height:1000px;
  float:left;
  margin-top:12%;
}

#wikicontent{
  background:url(https://static.igem.org/mediawiki/2015/6/67/IITDwikipages_background.jpg);
  opacity:1;
  height:1200px;
  width:80%;
  position:absolute;
  margin-left:18%;
  margin-top:12%;
}

.smenu{
  color:white;
  display:none;
  position:absolute;
  font-size:125%;
  margin-left:6% !important;
  margin-top:4% !important;
  z-index:2;
  list-style-type:none !important;
  font-weight:bold;
}

.snav {
  width: 200px;
  margin-left:2px;
  position:fixed;
}

.mnmenu, .sbmenu {
  list-style: none;
  padding: 0;
  margin: 0;
}

.mnmenu a {
  display: block;
  background-color: #194775;
  text-decoration: none;
  padding: 10px;
  color: white;
  font-size:125%;
}

.mnmenu a:hover {
    background-color: #002952;
}

.mnmenu li:hover .sbmenu {
  display: block;
  max-height: 200px;
}

.sbmenu a {
  background-color: #4D7094;
}

.sbmenu a:hover {
  background-color: #002E5C;
}

.sbmenu {
  overflow: hidden;
  max-height: 0;
  -webkit-transition: all 0.5s ease-out;
}

table{
 color:white;
 background:url(https://static.igem.org/mediawiki/2015/6/67/IITDwikipages_background.jpg);
 background-repeat: no-repeat;
}

td{
	padding:10px 35px;
	text-aling:justify;
        }
			
        td.det{
	width:80%;
        }
	
        h3{
	font-weight:bold;
	}
	
        img.team{
	background-color: #B0B0B0;
	border: 5px solid #003366 ;
        height:400px;
	width:300px;
	}

/* content Top */
section.page-top {
	background-color: #171717;
	border-bottom: 5px solid #CCC;
	border-top: 5px solid #384045;
	min-height: 50px;
	padding: 0;
	position: relative;
	text-align: left;
        color:white;
}

section.page-top ul.breadcrumb {
	background: none;
	margin: -3px 0 0;
	padding: 0;
}

section.page-top ul.breadcrumb > li {
	text-shadow: none;
}

section.page-top h2 {
	color: #FFF;
	display: inline-block;
	font-weight: 200;
	margin: 0 0 -25px;
	min-height: 37px;
	padding: 0 0 17px;
	position: relative;
}

/* Page Top Custom - Create your Own */
section.page-top.custom-product {
	background: #999;
	border-top: 5px solid #888;
}

section.page-top.custom-product div.row {
	position: relative;
}

section.page-top.custom-product p.lead {
	color: #CCC;
}

section.page-top.custom-product img {
	bottom: -20px;
	position: absolute;
	right: 0;
}

section.page-top.custom-product h1 {
	color: #FFF;
	margin-bottom: 10px;
	margin-top: 30px;
}

ul.ldd_menu{
	margin-top:110px;
        margin-left:-1%;
	padding:0;
        position:absolute;
	height:70px;
	list-style:none;
	font-family:Verdana, Geneva, sans-serif;
        font-size:100%;
	text-align: center;
}
ul.ldd_menu a{
	text-decoration:none;
}
ul.ldd_menu > li{
	float:left;
	position:fixed;
	width: 100%;
	z-index: 9999;
}
ul.ldd_menu > li > span{
	float:right;
        position:absolute;
        margin-left:550px;
        font-size:100%;
	color:green;
	background-color:white;
	height:50px;
	line-height:50px;
	cursor:default;
	padding:0px 20px;
	text-shadow:0px 0px 1px #CCC;
	}

.sub_wrap{
	width: 2500px;
	margin: 0 auto 0 auto;
	background-color: #000;
}

ul.ldd_menu ul{
	list-style:none;
	display: inline-block;
	border-left:1px dotted #FFF;
	margin-top: 20px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 20px;
	padding-top: 10px;
	padding-right: 5px;
	padding-bottom: 10px;
	padding-left: 10px;
}

ul.ldd_menu .ldd_submenu{
	position:absolute;
	top:50px;
	width:100%;
	display:none;
	opacity:0.90;
	font-size:10px;
	
	background-color: #000;
}
a.ldd_subfoot{
	background-color:#f0f0f0;
	color:#444;
	display:block;
	clear:both;
	padding:15px 20px;
	font-family: Arial, serif;
	font-size:10px;
	text-shadow:0px 0px 1px #fff;
	-moz-box-shadow:0px 0px 2px #777 inset;
	-webkit-box-shadow:0px 0px 2px #777 inset;
	-box-shadow:0px 0px 2px #777 inset;
}

li.ldd_heading{
	font-family: Georgia, serif;
	font-size: 13px;
	font-style: italic;
	color:#FF3300;
	text-shadow:0px 0px 1px #B03E23;
	padding:0px 0px 10px 0px;
}
ul.ldd_menu ul li a{
	font-family: Arial, serif;
	font-size:12px;
	line-height:20px;
	color:#fff;
	padding:1px 3px;
}
ul.ldd_menu ul li a:hover{
	background:#FF3300;
}

.left_message{
	position:relative;
	background: url(../images/pages/left_box.png) no-repeat;
	width:263px;
	height:115px;
	padding:5px;
	margin-bottom: 20px;
	margin-left: 20px;
	left: -70px;
}

li.left_message_title{
	font-family: Georgia, serif;
	font-size: 15pt;
	font-style: italic;
	color:#FFCC00;
	padding:15px 30px 20px 20px;
	list-style-type: none;
	line-height: 18pt;
	letter-spacing: 1pt;
	text-align: center;
}

.right_message{
	background: url(../images/pages/right_pict_frame.png) no-repeat;
	position:relative;
	left:800px;
	top:-140px;
	width:261px;
	height:186px;
	margin-bottom: 20px;
	padding-left:20px;
	padding-top:18px;

}

.right_pict{
	position:relative;
	left:800px;
	top:-340px;
	width:225px;
	height:149px;
}

<link rel="stylesheet" href="https://2015.igem.org/Team:IIT_Delhi/CSS_bootstrap?action=raw&ctype=text/css" type="text/css"/>

</style>	<!-- End of CSS -->
<body> 
  <div id="wrapper">
  <div id="header">
  <img id="IITDigem_logo"  src="https://static.igem.org/mediawiki/2015/f/ff/IITDigem_logo.png">
  <nav>
    <div class="iconsDiv" style="margin-left:22%;">
      <img class="icons" id="icon1" src="https://static.igem.org/mediawiki/2015/2/2f/IITDproject1.png">

      <ul class="smenu">
       <li>BACKGROUND</li>
       <li>SOLUTION</li>
       <li>RESEARCH</li>
       <li>PROTOTYPE</li>
       <li>CONCLUSION</li>
      </ul>
    </div>

    <div class="iconsDiv" style="margin-left:29%;">
      <img class="icons" id="icon2" src="https://static.igem.org/mediawiki/2015/b/b9/IITDmodelling1.png">

      <ul class="smenu">
       <li>INTRODUCION</li>
       <li>MATHEMATICAL MODEL</li>
       <li>SIMULATION</li>
       <li>INTERPRETATION</li>
      </ul>
    </div>

    <div class="iconsDiv" style="margin-left:36%;">
      <img class="icons" id="icon3" src="https://static.igem.org/mediawiki/2015/0/01/Team1iitd.png">

      <ul class="smenu">
       <li>OUR STORY</li>
       <li>MENTORS</li>
       <li>MEMBERS</li>
       <li>SPONSORS</li>
       <li>CARPE DIEM</li>
      </ul>
    </div>

    <div class="iconsDiv" style="margin-left:43%;">
      <img class="icons" id="icon4" src="https://static.igem.org/mediawiki/2015/e/ee/Notebook_iitd.png">

      <ul class="smenu">
       <li>SUMMARY</li>
       <li>TIMELINE</li>
       <li>ALBUM</li>
      </ul>
    </div>

    <div class="iconsDiv" style="margin-left:50%;">
      <img class="icons" id="icon5" src="https://static.igem.org/mediawiki/2015/8/86/Abstract1_iitd.png">
    </div>

    <div class="iconsDiv" style="margin-left:57%;">
      <img class="icons" id="icon6" src="https://static.igem.org/mediawiki/2015/3/3c/Collabaration1_iitd.png">

      <ul class="smenu">
       <li>IISER</li>
       <li>ENACTUS</li>
       <li>OUTREACH</li>
      </ul>
    </div>

    <div class="iconsDiv" style="margin-left:64%;">
      <img class="icons" id="icon7" src="https://static.igem.org/mediawiki/2015/5/51/Ethics1_iitd.png">

      <ul class="smenu">
       <li>ORIENTATION</li>
       <li>OPEN HOUSE</li>
       <li>TRYST</li>
       <li>SURVEYS</li>
      </ul>
    </div>

    <div class="iconsDiv" style="margin-left:71%;">
      <img class="icons" id="icon8" src="https://static.igem.org/mediawiki/2015/0/0b/Results1_iitd.png">

      <ul class="smenu">
       <li>PARTS SUBMITTED</li>
       <li>JUDGING CRITERION</li>
       <li>ATTRIBUTES</li>
      </ul>
    </div>
  </nav>
  
  <div id="tour">
    <img src="https://static.igem.org/mediawiki/2015/1/11/IITDigem_tour.png">
  </div>

  <div class="box">
			<ul id="ldd_menu" class="ldd_menu">
				<li>
					<span>SITE-MAP</span>
                    
                    
                  <div class="ldd_submenu">
						<ul>
							<li class="ldd_heading">PROJECT</li>
							<li><a href="#">BACKGROUND</a></li>
							<li><a href="#">SOLUTION</a></li>
							<li><a href="#">RESEARCH</a></li>
							<li><a href="#">PROTOTYPE</a></li>
                                                        <li><a href="#">CONCLUSION</a></li>
						</ul>
						<ul>
							<li class="ldd_heading">MODELLING</li>
							<li><a href="#">INTRODUCTION</a></li>
							<li><a href="#">MATHEMATICAL MODEL</a></li>
                                                        <li><a href="#">SIMULATION/a></li>
							<li><a href="#">INTERPRETATION</a></li>
                                                        <li><a href="#"></a></li>
						</ul>
                        <ul>
							<li class="ldd_heading">TEAM</li>
							<li><a href="#">OUR STORY</a></li>
							<li><a href="#">MENTORS</a></li>
                                                        <li><a href="#">MEMBERS</a></li>
							<li><a href="#">SPONSORS</a></li>
                                                        <li><a href="#">CARPE DIEM</a></li>
						</ul>
                         <ul>
							<li class="ldd_heading">NOTEBOOK</li>
							<li><a href="#">SUMMARY</a></li>
							<li><a href="#">TIMELINE</a></li>
							<li><a href="#">ALBUM</a></li>
                                                        <li><a href="#"></a></li>
                                                        <li><a href="#"></a></li>
						</ul>
                        <ul>
							<li class="ldd_heading">ABSTRACT</li>
                                                        <li><a href="#"></a></li>
                                                        <li><a href="#"></a></li>
                                                        <li><a href="#"></a></li>
                                                        <li><a href="#"></a></li>
                                                        <li><a href="#"></a></li>
       						</ul>
                        <ul>
							<li class="ldd_heading">COLLABORATION</li>
                                                        <li><a href="#">IISER</a></li>
							<li><a href="#">ENACTUS</a></li>
                                                        <li><a href="#">OUTREACH</a></li>
                                                        <li><a href="#"></a></li>
                                                        <li><a href="#"></a></li>
						</ul>
                        <ul>
							<li class="ldd_heading">ETHICS</li>
                                                        <li><a href="#">ORIENATION</a></li>
							<li><a href="#">OPEN HOUSE</a></li>
                                                        <li><a href="#">TRYST</a></li>
							<li><a href="#">SURVEYS</a></li>
                                                        <li><a href="#"></a></li>
						</ul>
                                                <ul>
							<li class="ldd_heading">RESULTS</li>
							<li><a href="#">PARTS SUBMITTED</a></li>
							<li><a href="#">JUDGING CRITERION</a></li>
                                                        <li><a href="#">ATTRIBUTIONS</a></li>
                                                        <li><a href="#"></a></li>
                                                        <li><a href="#"></a></li>
						</ul>
						<a class="ldd_subfoot" href="#"> Accessibility Link</a>
					</div>
				</li>
			</ul>
		</div>

    </div>

  </div>      


    <div id="leftNav">
      <h1 style="color:white;font-family:Verdana, Geneva, sans-serif;font-size:200%;text-align:center;">CONTENTS</h1>
  <nav class="snav">
  <ul class="mnmenu">
    <li><a href="">AAA</a></li>
    <li><a href="">AAA</a></li>
    <li><a href="">AAA</a>
      <ul class="sbmenu">
        <li><a href="">BBB</a></li>
        <li><a href="">BBB</a></li>
        <li><a href="">BBB</a></li>
      </ul>
    </li>
    <li><a href="">AAA</a></li>
  </ul>
</nav>
    </div>
  
    <div id="wikicontent">
     <h1 style="color:white;font-family:Verdana, Geneva, sans-serif;font-size:200%;">iGEM IIT DELHI</h1>
      <div role="main" class="main">

	<section class="page-top">
                            <font size="6">
				<ul class="breadcrumb" style:"text-decoration:none;">
				        <a href="index.html">Home</a> <span class="divider">/</span>
				        <a href="">Project </a><span class="divider">/<span> Introduction
				</ul>
                           </font>
	</section>

   </div>
			
		
   <div class="container">
		    <table>
			<tr>
			<td class="det" align="right">
			<h1 style="font-family:Verdana, Geneva, sans-serif;color:white;">Origin</h1>
<h2 style="font-family:Verdana, Geneva, sans-serif;color:white;">
				In today’s modern world, greenhouse gases such as NOx and SOx pose a major global issue that needs to be addressed. These oxides also increase the oxidizing capacity of the atmosphere which are responsible for the photochemical production of ozone in the lower layers of the atmosphere which has detrimental effects. Sulfur Oxides (SOx) are the main precursors of air pollution which is a deteriorating problem as well. Producing acid rain and acidified soils, Sulfur Oxides not only result in respiratory problems such as asthma and pneumonia, but also destroy farm crops, buildings and environment, causing loss of millions of dollars every year.	
</h2>
		         </td>
			 <td><img class="team" src="https://static.igem.org/mediawiki/2015/b/b4/Ecoli1.jpg" height="400px" width="200px"></td>
			 </tr>
		       </table>

                      <table>
			   <tr>
			     <td><img class="team" src="img/t.jpg" height="200px" width="200px"></td>
					<td class="det">
						<h3 align="left">DEF<br><small>BBBBBBBB</small></h3>
						content content
					<br />
                                         <br />
			</td>
			</tr>
		</table>
         </div>
    </div>
  </div>
   
  <script>
    $(document).ready(function(){
      $(".iconsDiv").hover(
        function(){
          $(this).css("background-color","black");
          $(this).css("z-index","3");
          $(this).children(".icons").addClass("iconActive");
          $(this).children("ul").css("display","block");
        },
        function(){
          $(this).css("background-color","transparent");
          $(this).css("z-index","0");
          $(this).children(".icons").removeClass("iconActive");
          $(this).children("ul").css("display","none");          
        }
      );
    });
  </script> 

  <script>
$(document).ready(function(){
console.log("hi2");
				/**
				 * the menu
				 */
				var $menu = $('#ldd_menu');
				
				/**
				 * for each list element,
				 * we show the submenu when hovering and
				 * expand the span element (title) to 510px
				 */
				$menu.children('li').each(function(){
					var $this = $(this);
					var $span = $this.children('span');
					$span.data('width',$span.width());
					
					$this.bind('mouseenter',function(){
						$menu.find('.ldd_submenu').stop(true,true).hide();
						$span.stop().animate({'width':'100%'},200,function(){
							$this.find('.ldd_submenu').slideDown(400);
						});
					}).bind('mouseleave',function(){
						/**$this.find('.ldd_submenu').stop(true,true).hide(); */
						$span.stop().animate({'width':$span.data('width')+'px'},300);
						$this.find('.ldd_submenu').slideUp(400);
					});
				});
            });
			
			//ipad and iphone fix
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i))) {
    $(" #ldd_menu li a").click(function(){
        //we just need to attach a click event listener to provoke iPhone/iPod/iPad's hover event
        //strange
    });
}
</script>
     
</body>
</html>