Difference between revisions of "Template:IIT Madras"

 
(94 intermediate revisions by 3 users not shown)
Line 1: Line 1:
 
<!-- Declare that you are going to use html code instead of wiki code -->
 
<!-- Declare that you are going to use html code instead of wiki code -->
 
<html>
 
<html>
 +
 +
<!--<meta name="viewport" content="user-scalable=1, width=400">-->
 +
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
 +
<!-- Latest compiled and minified CSS -->
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
 +
 +
<!-- Optional theme -->
 +
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
 +
 +
<!-- Latest compiled and minified JavaScript -->
 +
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
 +
<!--<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part0_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part1_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part2_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part3_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part4_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_part5_css?action=raw&ctype=text/css" rel="stylesheet">
 +
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Style_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<style>#mw-content-text > p {display:none}</style>
 +
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/jquery?action=raw&ctype=text/javascript"></script>
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/OpenSans_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Awesome_css?action=raw&ctype=text/css" rel="stylesheet">
 +
<link href="//2015.igem.org/Team:Cambridge-JIC/Assets/Fudge_css?action=raw&ctype=text/css" rel="stylesheet">
 +
 +
<link href="//2015.igem.org/wiki/images/3/3a/CamJIC-Favicon.png" rel="icon">
 +
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/Bootstrap_js?action=raw&ctype=text/javascript"></script>
 +
<script src="//2015.igem.org/Team:Cambridge-JIC/Assets/Fudge_js?action=raw&ctype=text/javascript"></script>
 +
<script src="//2015.igem.org/common/MathJax-2.5-latest/MathJax.js?config=TeX-AMS-MML_HTMLorMML"></script> -->
 +
  
 
         <!-- Start of CSS-->
 
         <!-- Start of CSS-->
Line 26: Line 56:
 
margin:0 auto;
 
margin:0 auto;
 
}
 
}
 +
                        #topbanner {
 +
                                              width:100%;
 +
                                              color:#FF0000;
 +
                        }
 
</style>
 
</style>
  
 +
                       
 
<!-- Start of CSS-->
 
<!-- Start of CSS-->
  
Line 55: Line 90:
 
/* Set up a width, height and color of the body wrapper*/
 
/* Set up a width, height and color of the body wrapper*/
 
html,body {  
 
html,body {  
background-color: #fff;
 
                                width:100%;
 
                                height:100%;
 
 
                                 margin:0;
 
                                 margin:0;
 
                                 border:0;
 
                                 border:0;
 +
                                padding:0;
 
}
 
}
  
Line 66: Line 99:
 
                                 margin 0 auto;
 
                                 margin 0 auto;
 
width: 100%;
 
width: 100%;
 +
                                background-color: #F5FFFA;
 
overflow:hidden;
 
overflow:hidden;
 
                                 /*float:left;
 
                                 /*float:left;
Line 75: Line 109:
 
/* Creates the container for the menu */
 
/* Creates the container for the menu */
 
#menuContainer  {  
 
#menuContainer  {  
/*float:left;*/
+
                                 position:absolute;
                                 position:fixed;
+
 
width: 100%;
 
width: 100%;
/*padding: 0px 0px;*/
+
background-color: #458B74;
background-color: #000000 ;
+
/*border-top: 20px solid #14747D;*/
+
/*font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;*/
+
 
                                 list-style-type:none;
 
                                 list-style-type:none;
 
}
 
}
Line 91: Line 121:
 
                                 width:75%;
 
                                 width:75%;
 
background-color: #fff;  
 
background-color: #fff;  
/*font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;*/
+
                                padding:20px;
 +
font-family: "Lucida Sans Unicode", "Lucida Grande", sans-serif;
 +
                              font-size:16px;
 
                               text-align: justify;
 
                               text-align: justify;
 
}
 
}
Line 98: Line 130:
 
/*Set up height place holder for the banner*/
 
/*Set up height place holder for the banner*/
 
#bannerContainer {
 
#bannerContainer {
 +
                                position:fixed;
 
                                 width:100%
 
                                 width:100%
height:1000px;
+
height:40px;
text-align:center;
+
background-color: #FF0000;
color: #D3D3D3;
+
                                list-style-type:none;
 
}
 
}
  
Line 108: Line 141:
 
/*Change the styling of text for everything inside main container*/
 
/*Change the styling of text for everything inside main container*/
 
#mainContainer p {  
 
#mainContainer p {  
font-size: 15px;
 
 
color: #000000;
 
color: #000000;
 
}
 
}
Line 169: Line 201:
 
/*Styling for the links in the menu */
 
/*Styling for the links in the menu */
 
#menuContainer a {
 
#menuContainer a {
                                /*float:left;*/
 
 
                                 display:block;
 
                                 display:block;
 
color: #fff;
 
color: #fff;
 
text-decoration:none;
 
text-decoration:none;
 
                                 font-size:20px;
 
                                 font-size:20px;
                                /*display:inline-block;*/
 
 
}
 
}
  
 
                 /*Styles the font links in the menu*/
 
                 /*Styles the font links in the menu*/
 
                 #menuContainer a:hover {
 
                 #menuContainer a:hover {
                                 color:#D3D3D3;
+
                                 color:#FF6600;
 
                       }
 
                       }
  
Line 185: Line 215:
 
#menuContainer ul {  
 
#menuContainer ul {  
 
list-style-type: none;
 
list-style-type: none;
/*margin-left:0px;*/
 
 
}
 
}
  
Line 194: Line 223:
 
text-align: center;
 
text-align: center;
 
display: inline-block;
 
display: inline-block;
width: 16%;
+
width: 14%;
 
height:40px;
 
height:40px;
 
                                 line-height:40px;
 
                                 line-height:40px;
Line 202: Line 231:
 
}
 
}
  
/*For the menu buttons, changes the color when hovering
 
#menuContainer li:hover {
 
 
}*/
 
  
 
/*Submenus are not displayed as default*/
 
/*Submenus are not displayed as default*/
 
#menuContainer li ul {
 
#menuContainer li ul {
                                 position:absolute;
+
                                 position:relative;
 
display: none;
 
display: none;
 
                                 width:100%;
 
                                 width:100%;
Line 216: Line 241:
 
/*Submenus are displayed when hovering the menu button */
 
/*Submenus are displayed when hovering the menu button */
 
#menuContainer li:hover ul {
 
#menuContainer li:hover ul {
 +
                                left:-21px;
 +
                                position:relative;
 
display: block;
 
display: block;
 
  }
 
  }
 +
 +
                  #menuContainer li li:before {
 +
                              content: "";
 +
                              display: block;
 +
                              height: 20px;
 +
                              position: absolute;
 +
                              top:-5px;
 +
                              width: 100%;
 +
                        }
  
 
/*Style the submenu buttons*/
 
/*Style the submenu buttons*/
 
#menuContainer li ul li{
 
#menuContainer li ul li{
                                 background-color: #000000 ;
+
                                position:relative;
 +
                                 background-color: #458B74 ;
 
                                 display:block;
 
                                 display:block;
 
                                 width:100%;
 
                                 width:100%;
 +
                                border:none;
 
}
 
}
 +
 +
                #cf {
 +
                        position:relative;
 +
                        height:500px;
 +
                        width:500px;
 +
                          margin:0 auto;
 +
                      }
 +
 +
                        #cf img {
 +
                            position:absolute;
 +
                            left:0;
 +
                            -webkit-transition: opacity 1s ease-in-out;
 +
                            -moz-transition: opacity 1s ease-in-out;
 +
                            -o-transition: opacity 1s ease-in-out;
 +
                            transition: opacity 1s ease-in-out;
 +
                          }
 +
 +
                          #cf img.top:hover {
 +
                          opacity:0;
 +
                            }
  
 
/*CLASSES */
 
/*CLASSES */
Line 246: Line 304:
 
             }
 
             }
  
 +
figure{
 +
display:inline-block;
 +
}
 +
 +
 +
figcaption {
 +
    text-align: center;
 +
    border:1px;
 +
}
  
 
</style>
 
</style>
Line 252: Line 319:
  
 
<!-- Start of the template html elements. -->
 
<!-- Start of the template html elements. -->
                 <body>               <!--This will close on the page-->
+
                 <body>      
 +
      <!--This will close on the page-->
 
 
 
                 <div id ="mainContainer"><!--This div will close on the page.-->
 
                 <div id ="mainContainer"><!--This div will close on the page.-->
 +
 +
                <div id = "topbanner"></div>
 
                 <!--Start of Menu-->
 
                 <!--Start of Menu-->
 
<div id="menuContainer">
 
<div id="menuContainer">
Line 262: Line 332:
 
<a href="https://2015.igem.org/Team:IIT_Madras"><li>Home</li></a>
 
<a href="https://2015.igem.org/Team:IIT_Madras"><li>Home</li></a>
  
                                        <a href="https://2015.igem.org/Team:IIT_Madras/Design"><li>Design</li></a>
+
                                          <a href="#"><li>Project
 +
            <ul>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Background"><li>Background</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Description"><li>Our Approach</li></a>
 +
                                                        <!--<a href="https://2015.igem.org/Team:IIT_Madras/In-Silico"><li>In-Silico</li></a> -->
 +
</ul>
 +
</li></a>
 
                                      
 
                                      
                                        <a href="https://2015.igem.org/Team:IIT_Madras/Experiments"><li>Experiments</li></a>
+
                                          <a href="#"><li>Experiments
 +
            <ul>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Notebook"><li>Notebook</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Experiments"><li>Protocols</li></a>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Parts"><li>Parts</li></a>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Results"><li>Results</li></a>   
 +
</ul>
 +
</li></a>
 +
 
 +
                                       
 +
                                      <a href="https://2015.igem.org/Team:IIT_Madras/Safety"><li>Safety</li></a>
  
 
                                       <a href="https://2015.igem.org/Team:IIT_Madras/Practices"><li>Human Practices</li></a>                                         
 
                                       <a href="https://2015.igem.org/Team:IIT_Madras/Practices"><li>Human Practices</li></a>                                         
 
                                          
 
                                          
                                        <a href="https://2015.igem.org/Team:IIT_Madras/Notebook"><li>Notebook</li></a>
+
                                      <a href="https://2015.igem.org/Team:IIT_Madras/Future"><li>Future</li></a>
 +
                                       
  
                                        <a href="#"><li>About Us</a>
+
                                        <a href="#"><li>About Us</a>
 
                                                 <ul>
 
                                                 <ul>
 
                                                         <a href="https://2015.igem.org/Team:IIT_Madras/Team"><li>Team</li></a>
 
                                                         <a href="https://2015.igem.org/Team:IIT_Madras/Team"><li>Team</li></a>
 
                                                         <a href="https://2015.igem.org/Team:IIT_Madras/Attributions"><li>Attributions</li></a>  
 
                                                         <a href="https://2015.igem.org/Team:IIT_Madras/Attributions"><li>Attributions</li></a>  
 +
<a href="https://2015.igem.org/Team:IIT_Madras/gallery"><li>Gallery</li></a>
 
                                                 </ul>
 
                                                 </ul>
 
                                         </li></a>
 
                                         </li></a>
Line 281: Line 369:
 
                                         <a href="#"><li>Project
 
                                         <a href="#"><li>Project
 
             <ul>
 
             <ul>
<a href="https://2015.igem.org/Team:IIT_Madras/Description"><li>Description</li></a>
+
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/Background"><li>Background</li></a>
 +
<a href="https://2015.igem.org/Team:IIT_Madras/Description"><li>Our Approach</li></a>
 +
                                                        <a href="https://2015.igem.org/Team:IIT_Madras/In-Silico"><li>In-Silico</li></a>
 
<a href="https://2015.igem.org/Team:IIT_Madras/Experiments"><li>Experiments &amp; Protocols</li></a>   
 
<a href="https://2015.igem.org/Team:IIT_Madras/Experiments"><li>Experiments &amp; Protocols</li></a>   
 
<a href="https://2015.igem.org/Team:IIT_Madras/Results"><li>Results</li></a>   
 
<a href="https://2015.igem.org/Team:IIT_Madras/Results"><li>Results</li></a>   
Line 319: Line 409:
 
                       <!--End of Menu-->
 
                       <!--End of Menu-->
  
+
<!--<br><br><br>
 +
<div style="text-align: center;">
 +
<img height="400px" width="400px" src="https://static.igem.org/mediawiki/2015/9/9d/Black%26WhiteiGEMlogo1.png">
 +
</div>-->
 +
 
  
 +
 +
</body>
 
<!-- Start of content -->
 
<!-- Start of content -->
 
</html>
 
</html>
 +
<div id="contentContainer">

Latest revision as of 12:25, 18 September 2015