Difference between revisions of "Team:CityU HK/Template"

(Created page with "{{:Team:CityU_HK/Template/CSS}} <html> <html lang="en"> <style> body { background-color: #FFFFCC;: background-size:contain; background-repeat: no-repeat; backgroun...")
 
Line 1: Line 1:
 
{{:Team:CityU_HK/Template/CSS}}
 
{{:Team:CityU_HK/Template/CSS}}
 
 
<html>
 
<html>
<html lang="en">
+
<head>
 +
<title>City University of Hong Kong 2015 - Home</title>
  
 +
 +
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 +
 +
 +
<link rel="stylesheet" type="text/css" href="http://cdn2.editmysite.com/css/sites.css?buildTime=1234" />
 +
<link rel="stylesheet" type="text/css" href="http://cdn1.editmysite.com/editor/libraries/fancybox/fancybox.css?1234" />
 +
<link rel="stylesheet" type="text/css" href="files/main_style.css?1436694200" title="wsite-theme-css" />
 +
<link href='http://fonts.googleapis.com/css?family=Droid+Serif:400,700,400italic,700italic&subset=latin,latin-ext' rel='stylesheet' type='text/css' />
 +
 +
<style type='text/css'>
 +
.wsite-elements.wsite-not-footer div.paragraph, .wsite-elements.wsite-not-footer p, .wsite-elements.wsite-not-footer .product-block .product-title, .wsite-elements.wsite-not-footer .product-description, .wsite-elements.wsite-not-footer .wsite-form-field label, .wsite-elements.wsite-not-footer .wsite-form-field label, #wsite-content div.paragraph, #wsite-content p, #wsite-content .product-block .product-title, #wsite-content .product-description, #wsite-content .wsite-form-field label, #wsite-content .wsite-form-field label, .blog-sidebar div.paragraph, .blog-sidebar p, .blog-sidebar .wsite-form-field label, .blog-sidebar .wsite-form-field label {}
 +
#wsite-content div.paragraph, #wsite-content p, #wsite-content .product-block .product-title, #wsite-content .product-description, #wsite-content .wsite-form-field label, #wsite-content .wsite-form-field label, .blog-sidebar div.paragraph, .blog-sidebar p, .blog-sidebar .wsite-form-field label, .blog-sidebar .wsite-form-field label {}
 +
.wsite-elements.wsite-footer div.paragraph, .wsite-elements.wsite-footer p, .wsite-elements.wsite-footer .product-block .product-title, .wsite-elements.wsite-footer .product-description, .wsite-elements.wsite-footer .wsite-form-field label, .wsite-elements.wsite-footer .wsite-form-field label{}
 +
.wsite-elements.wsite-not-footer h2, .wsite-elements.wsite-not-footer .product-long .product-title, .wsite-elements.wsite-not-footer .product-large .product-title, .wsite-elements.wsite-not-footer .product-small .product-title, #wsite-content h2, #wsite-content .product-long .product-title, #wsite-content .product-large .product-title, #wsite-content .product-small .product-title, .blog-sidebar h2 {}
 +
#wsite-content h2, #wsite-content .product-long .product-title, #wsite-content .product-large .product-title, #wsite-content .product-small .product-title, .blog-sidebar h2 {}
 +
.wsite-elements.wsite-footer h2, .wsite-elements.wsite-footer .product-long .product-title, .wsite-elements.wsite-footer .product-large .product-title, .wsite-elements.wsite-footer .product-small .product-title{}
 +
#wsite-title {font-size:31px !important;font-weight:400 !important;}
 +
.wsite-menu-default a {}
 +
.wsite-menu a {}
 +
.wsite-image div, .wsite-caption {}
 +
.galleryCaptionInnerText {}
 +
.fancybox-title {}
 +
.wslide-caption-text {}
 +
.wsite-phone {font-family:"Arial" !important;font-size:17px !important;}
 +
.wsite-headline {font-size:14px !important;}
 +
.wsite-headline-paragraph {}
 +
.wsite-button-inner {}
 +
.wsite-not-footer blockquote {}
 +
.wsite-footer blockquote {}
 +
.blog-header h2 a {}
 +
#wsite-content h2.wsite-product-title {}
 +
.wsite-product .wsite-product-price a {}
 +
</style>
 
<style>
 
<style>
 +
.wsite-background {background-image: url('//cdn1.editmysite.com/uploads/5/5/0/1/55018825/background-images/754325555.jpg') !important;background-repeat: no-repeat !important;background-position: 0% 23.4300003051758% !important;background-size: 100% !important;background-color: transparent !important;}
 +
body.wsite-background {background-attachment: fixed !important;}.wsite-background.wsite-custom-background{ background-size: cover !important}
 +
</style>
 +
<style type='text/css'>
 +
.wsite-header {
 +
background-image: url(uploads/5/5/0/1/55018825/header_images/1436693632.jpg) !important;
 +
background-position: 0 0 !important;
 +
}
 +
</style>
 +
 +
<script><!--
 +
var STATIC_BASE = '//cdn1.editmysite.com/';
 +
var STYLE_PREFIX = 'wsite';
 +
//-->
 +
</script>
 +
<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'></script>
 +
 +
<script src="http://cdn2.editmysite.com/js/site/main.js?buildTime=1234"></script><script type="text/javascript">_W.configDomain = "www.weebly.com";</script><script type="text/javascript" src="http://cdn2.editmysite.com/js/lang/en/ftl.js?buildTime=1234"></script><script>_W.relinquish && _W.relinquish()</script>
 +
<script type="text/javascript"><!--
 +
var IS_ARCHIVE = 1;
 +
 +
(function(jQuery){
 +
function initFlyouts(){
 +
initPublishedFlyoutMenus(
 +
[{"id":"405207076881051096","title":"Home","url":"index.html","target":""},{"id":"579605018939103781","title":"About","url":"about.html","target":""},{"id":"915979469738984051","title":"Contact","url":"contact.html","target":""},{"id":"444997708628807445","title":"Untitled","url":"untitled4.html","target":""},{"id":"624186960293168361","title":"Untitled","url":"untitled5.html","target":""},{"id":"766729801302810591","title":"Untitled","url":"untitled6.html","target":""}],
 +
"405207076881051096",
 +
"<li class=\"wsite-menu-item-wrap\"><a href=\"#\" data-membership-required=\"\" class=\"wsite-menu-item\">{{title}}<\/a><\/li>",
 +
'active',
 +
false,
 +
{"menu\/submenu-main":"<div class=\"wsite-menu-wrap\" style=\"display:none\">{{! Designer note: \"wsite-menu-wrap\" required on submenu wrapper }}\n\t<ul class=\"wsite-menu\">{{! Designer note: \"wsite-menu\" required on submenu element }}\n\t\t{{#children}}{{> menu\/submenu-item}}{{\/children}}\n\t<\/ul>\n<\/div>\n","menu\/submenu-item":"<li{{#id}} id=\"{{id}}\"{{\/id}} class=\"wsite-menu-subitem-wrap{{#current_page}} wsite-nav-current{{\/current_page}}\">{{! Designer note: id required & \"wsite-menu-subitem-wrap\" required on the item wrap }}\n\t<a href=\"{{itemlink}}\"{{#target}} target=\"{{target}}\"{{\/target}} class=\"wsite-menu-subitem\">{{! Designer note: \"wsite-menu-subitem\" required on the item link }}\n\t\t<span class=\"wsite-menu-title\">\n\t\t\t{{{itemtitle}}}\n\t\t<\/span>{{#has_children}}<span class=\"wsite-menu-arrow\">&gt;<\/span>{{\/has_children}}\n\t<\/a>\n\t{{#has_children}}{{> menu\/submenu-main}}{{\/has_children}}\n<\/li>\n","menu\/main":"<ul class=\"wsite-menu-default\">{{> menu\/main-without-wrap}}<\/ul>{{! Designer note: \"wsite-menu-default\" required on menu element }}\n","menu\/main-without-wrap":"{{#links}}{{!\n}}{{#current_page}}{{> menu\/item-current}}{{\/current_page}}{{!\n}}{{^current_page}}{{> menu\/item}}{{\/current_page}}{{!\n}}{{\/links}}\n","menu\/item-current":"<li{{#id}} id=\"{{id}}\"{{\/id}} class=\"wsite-menu-item-wrap\">{{! Designer note: id required & \"wsite-menu-item-wrap\" required on the item wrapper }}\n\t<a href=\"{{itemlink}}\"{{#target}} target=\"{{target}}\"{{\/target}} class=\"wsite-menu-item\">{{! Designer note: \"wsite-menu-item\" required on the item link }}\n\t\t{{{itemtitle}}}\n\t<\/a>\n\t{{#has_children}}{{> menu\/submenu-main}}{{\/has_children}}\n<\/li>\n","menu\/item":"<li{{#id}} id=\"{{id}}\"{{\/id}} class=\"wsite-menu-item-wrap\">{{! Designer note: id required & \"wsite-menu-item-wrap\" required on the item wrapper }}\n\t<a href=\"{{itemlink}}\" data-membership-required=\"{{membership-required}}\"{{#target}} target=\"{{target}}\"{{\/target}} class=\"wsite-menu-item\">{{! Designer note: \"wsite-menu-item\" required on the item link }}\n\t\t{{{itemtitle}}}\n\t<\/a>\n\t{{#has_children}}{{> menu\/submenu-main}}{{\/has_children}}\n<\/li>\n"}
 +
)
 +
}
 +
if (jQuery) {
 +
jQuery(document).ready(function() { jQuery(initFlyouts); });
 +
}else{
 +
if (Prototype.Browser.IE) window.onload = initFlyouts;
 +
else document.observe('dom:loaded', initFlyouts);
 +
}
 +
})(window._W && _W.jQuery)
 +
//-->
 +
</script>
 +
 +
</head>
 +
<body class="tall-header-page wsite-background  wsite-theme-light  wsite-page-index wsite-custom-background"><div id="header-wrap">
 +
<div class="container">
 +
<table id="header">
 +
<tr>
 +
<td id="logo"><span class="wsite-logo">
 +
 +
<a href="">
 +
 +
<span id="wsite-title">City University of Hong Kong 2015</span>
 +
 +
</a>
 +
 +
</span></td>
 +
<td id="header-right">
 +
<table>
 +
<tr>
 +
<td class="phone-number"></td>
 +
<td class="social"><div style="text-align:left;"><div style="height:0px;overflow:hidden"></div>
 +
<span class="wsite-social wsite-social-default"><a class='first-child wsite-social-item wsite-social-facebook' href='http://facebook.com/1111' target='_blank'><span class='wsite-social-item-inner'></span></a></span>
 +
<div style="height:0px;overflow:hidden"></div></div></td>
 +
<td class="search"></td>
 +
</tr>
 +
</table>
 +
<div class="clear"></div>
 +
</td>
 +
</tr>
 +
</table>
 +
</div><!-- end container -->
 +
</div><!-- end header-wrap --> 
 +
 +
<div id="nav-wrap">
 +
<div class="container">
 +
<table>
 +
<tr>
 +
<td id="nav"><div id="navigation"><ul class="wsite-menu-default"><li id="active" class="wsite-menu-item-wrap">
 +
<a href="index.html" class="wsite-menu-item">
 +
Home
 +
</a>
 +
 +
</li>
 +
<li id="pg579605018939103781" class="wsite-menu-item-wrap">
 +
<a href="about.html" data-membership-required="0" class="wsite-menu-item">
 +
About
 +
</a>
 +
<div class="wsite-menu-wrap" style="display:none">
 +
<ul class="wsite-menu">
 +
<li id="wsite-nav-194603648672021033" class="wsite-menu-subitem-wrap">
 +
<a href="untitled.html" class="wsite-menu-subitem">
 +
<span class="wsite-menu-title">
 +
Untitled
 +
</span>
 +
</a>
 +
 +
</li>
 +
 +
</ul>
 +
</div>
 +
 +
</li>
 +
<li id="pg915979469738984051" class="wsite-menu-item-wrap">
 +
<a href="contact.html" data-membership-required="0" class="wsite-menu-item">
 +
Contact
 +
</a>
 +
<div class="wsite-menu-wrap" style="display:none">
 +
<ul class="wsite-menu">
 +
<li id="wsite-nav-513017485639987710" class="wsite-menu-subitem-wrap">
 +
<a href="untitled1.html" class="wsite-menu-subitem">
 +
<span class="wsite-menu-title">
 +
Untitled
 +
</span>
 +
</a>
 +
 +
</li>
 +
<li id="wsite-nav-876843318437734394" class="wsite-menu-subitem-wrap">
 +
<a href="untitled2.html" class="wsite-menu-subitem">
 +
<span class="wsite-menu-title">
 +
Untitled
 +
</span>
 +
</a>
 +
 +
</li>
 +
<li id="wsite-nav-697603495208250391" class="wsite-menu-subitem-wrap">
 +
<a href="untitled3.html" class="wsite-menu-subitem">
 +
<span class="wsite-menu-title">
 +
Untitled
 +
</span>
 +
</a>
 +
 +
</li>
 +
 +
</ul>
 +
</div>
 +
 +
</li>
 +
<li id="pg444997708628807445" class="wsite-menu-item-wrap">
 +
<a href="untitled4.html" data-membership-required="0" class="wsite-menu-item">
 +
Untitled
 +
</a>
 +
 +
</li>
 +
<li id="pg624186960293168361" class="wsite-menu-item-wrap">
 +
<a href="untitled5.html" data-membership-required="0" class="wsite-menu-item">
 +
Untitled
 +
</a>
 +
 +
</li>
 +
<li id="pg766729801302810591" class="wsite-menu-item-wrap">
 +
<a href="untitled6.html" data-membership-required="0" class="wsite-menu-item">
 +
Untitled
 +
</a>
 +
 +
</li>
 +
 +
</ul>
 +
</div></td>
 +
</tr>
 +
</table>
 +
</div><!-- end container -->
 +
</div><!-- end nav-wrap -->
 +
 +
<div id="banner-wrap">
 +
<div class="container">
 +
<div id="banner">
 +
<div class="wsite-header"></div>
 +
<div style="clear:both;"></div>
 +
</div><!-- end banner -->
 +
</div><!-- end container -->
 +
</div><!-- end banner-wrap -->
 +
 +
<div id="main-wrap">
 +
<div class="container">
 +
<div id='wsite-content' class='wsite-elements wsite-not-footer'>
 +
<div><div class="wsite-multicol"><div class="wsite-multicol-table-wrap" style="margin:0 -20px;">
 +
<table class="wsite-multicol-table">
 +
<tbody class="wsite-multicol-tbody">
 +
<tr class="wsite-multicol-tr">
 +
<td class="wsite-multicol-col" style="width:49.999999999999%; padding:0 20px;">
 +
 +
 +
 +
<div><div class="wsite-image wsite-image-border-border-width:0 " style="padding-top:10px;padding-bottom:10px;margin-left:0;margin-right:0;text-align:right">
 +
<a>
 +
<img src="uploads/5/5/0/1/55018825/1436693195.png" alt="Picture" style="width:auto;max-width:100%" />
 +
</a>
 +
<div style="display:block;font-size:90%"></div>
 +
</div></div>
 +
 +
 +
 +
</td> <td class="wsite-multicol-col" style="width:49.999999999999%; padding:0 20px;">
 +
 +
 +
 +
<h2 class="wsite-content-title" style="text-align:left;">Abstract</h2>
 +
 +
<div class="paragraph" style="text-align:left;">Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam.<br /><br />Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.&nbsp;<span style="text-align: justify;">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa.</span></div>
 +
 +
 +
 +
</td> </tr>
 +
</tbody>
 +
</table>
 +
</div></div></div>
 +
 +
<div><div style="height: 40px; overflow: hidden; width: 100%;"></div>
 +
<hr class="styled-hr" style="width:100%;"></hr>
 +
<div style="height: 40px; overflow: hidden; width: 100%;"></div></div>
 +
 +
<div><div class="wsite-multicol"><div class="wsite-multicol-table-wrap" style="margin:0 -25px;">
 +
<table class="wsite-multicol-table">
 +
<tbody class="wsite-multicol-tbody">
 +
<tr class="wsite-multicol-tr">
 +
<td class="wsite-multicol-col" style="width:33.333333333333%; padding:0 25px;">
 +
 +
 +
 +
<div><div class="wsite-image wsite-image-border-none " style="padding-top:10px;padding-bottom:15px;margin-left:0;margin-right:0;text-align:center">
 +
<a>
 +
<img src="uploads/5/5/0/1/55018825/8959057.jpg?282" alt="Picture" style="width:282;max-width:100%" />
 +
</a>
 +
<div style="display:block;font-size:90%"></div>
 +
</div></div>
 +
 +
<h2 class="wsite-content-title" style="text-align:center;"><font style="font-weight: normal;" size="5">Background</font></h2>
 +
 +
<div class="paragraph" style="text-align:center;"><span style="">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusant doloremque laudantium, totam rem.</span></div>
 +
 +
<div style="text-align:center;"><div style="height: 20px; overflow: hidden;"></div>
 +
<a class="wsite-button wsite-button-small wsite-button-normal" href="javascript:;" >
 +
<span class="wsite-button-inner">Learn More</span>
 +
</a>
 +
<div style="height: 10px; overflow: hidden;"></div></div>
 +
 +
 +
 +
</td> <td class="wsite-multicol-col" style="width:33.333333333333%; padding:0 25px;">
 +
 +
 +
 +
<div><div class="wsite-image wsite-image-border-border-width:0 " style="padding-top:10px;padding-bottom:0;margin-left:0;margin-right:0;text-align:center">
 +
<a>
 +
<img src="uploads/5/5/0/1/55018825/1436692725.png" alt="Picture" style="width:auto;max-width:100%" />
 +
</a>
 +
<div style="display:block;font-size:90%"></div>
 +
</div></div>
 +
 +
<h2 class="wsite-content-title" style="text-align:center;"><span style="font-weight: normal;"><font size="5">Parts</font></span></h2>
 +
 +
<div class="paragraph" style="text-align:center;"><span style="">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusant doloremque laudantium, totam rem.</span></div>
 +
 +
<div style="text-align:center;"><div style="height: 20px; overflow: hidden;"></div>
 +
<a class="wsite-button wsite-button-small wsite-button-normal" href="javascript:;" >
 +
<span class="wsite-button-inner">Learn More</span>
 +
</a>
 +
<div style="height: 10px; overflow: hidden;"></div></div>
 +
 +
 +
 +
</td> <td class="wsite-multicol-col" style="width:33.333333333333%; padding:0 25px;">
 +
 +
 +
 +
<div><div class="wsite-image wsite-image-border-border-width:0 " style="padding-top:10px;padding-bottom:0;margin-left:0;margin-right:0;text-align:left">
 +
<a>
 +
<img src="uploads/5/5/0/1/55018825/1436693101.png" alt="Picture" style="width:auto;max-width:100%" />
 +
</a>
 +
<div style="display:block;font-size:90%"></div>
 +
</div></div>
 +
 +
<h2 class="wsite-content-title" style="text-align:center;"><span style="font-weight: normal;"><font size="5">Characterization</font></span></h2>
 +
 +
<div class="paragraph" style="text-align:center;"><span style="">Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusant doloremque laudantium, totam rem.</span></div>
 +
 +
<div style="text-align:center;"><div style="height: 20px; overflow: hidden;"></div>
 +
<a class="wsite-button wsite-button-small wsite-button-normal" href="javascript:;" >
 +
<span class="wsite-button-inner">Learn More</span>
 +
</a>
 +
<div style="height: 10px; overflow: hidden;"></div></div>
 +
 +
 +
 +
</td> </tr>
 +
</tbody>
 +
</table>
 +
</div></div></div></div>
 +
 +
</div><!-- end container -->
 +
</div><!-- end main-wrap -->
 +
 +
 +
 +
 +
 +
</body>
 +
</html>
 +
 +
<html>
 +
<style>
 +
 +
 +
 +
 +
 +
/* Resets
 +
--------------------------------------------------------------------------------*/
 +
 +
ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, body, html, p, blockquote,
 +
fieldset, input {
 +
margin: 0;
 +
padding: 0;
 +
}
 +
 +
a img {
 +
border: 0;
 +
}
 +
 +
a {
 +
text-decoration: none;
 +
}
 +
 +
/* General Styling and Structure
 +
--------------------------------------------------------------------------------*/
 +
 
body {
 
body {
      /*background-color: #FFFFCC;*/
+
font-family: Georgia, serif;
background-size:contain;
+
font-size: 14px;
background-repeat: no-repeat;
+
background: #F2F2F2;
background-position:left;
+
color: #555;
background-attachment: fixed;
+
line-height:24px;
        background-size: cover
+
}
}
+
  
 +
.container {
 +
margin: 0 auto;
 +
width: 946px;
 +
padding:0 7px;
 +
background:#fff;
 +
}
  
</style>
+
#header-wrap,
 +
#banner-wrap,
 +
#nav-wrap,
 +
#main-wrap,
 +
#footer-wrap
 +
{
 +
        width:100%;
 +
}
  
<body>
+
#main-wrap .container {min-height:450px;}
<nav class="navbar navbar-default" role="navigation">
+
  <div class="container-fluid">
+
    <!-- Brand and toggle get grouped for better mobile display -->
+
    <div class="navbar-header" id="header">
+
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
+
        <span class="sr-only">Toggle navigation</span>
+
        <span class="icon-bar"></span>
+
        <span class="icon-bar"></span>
+
        <span class="icon-bar"></span>
+
      </button>
+
     
+
      <a class="navbar-brand">
+
          <a class="navbar-brand" id="igem"  href="https://2015.igem.org/Main_Page"><img src="https://static.igem.org/mediawiki/2014/d/d8/Team_Berlin_igem_logo.png" width="80px" height="70px"></a><a class="navbar-brand" href="https://2015.igem.org/Team:CityU_HK">City University of Hong Kong 2015</a>
+
    </div>
+
  
    <!-- Collect the nav links, forms, and other content for toggling -->
+
h3 {
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
+
font-size: 22px;
        <ul class="nav navbar-nav navbar-right">
+
padding: .2em 0 .2em 0;
        <li class="active"><a href="https://2014.igem.org/Team:CityU_HK">Home</a></li>
+
line-height: 1.2;
        <li class="dropdown">
+
font-weight: normal;
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Team Members</a>
+
letter-spacing: -1px;
          <ul class="dropdown-menu" role="menu">
+
color: #333;
            <li><a href="https://2014.igem.org/Team:CityU_HK/TeamMember">Students</a></li>
+
margin-bottom:20px;
            <li><a href="https://2014.igem.org/Team:CityU_HK/Team/instructors">Instructors & Advisors</a></li>
+
}
            <li><a href="https://2014.igem.org/Team:CityU_HK/Team/attribution">Attribution</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/Acknowledgement">Acknowledgement</a></li>
+
          </ul>
+
        </li>
+
        <li class="dropdown">
+
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Project</a>
+
          <ul class="dropdown-menu" role="menu">
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/project/overview">Overview</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/project/module_fad">Modules description</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/project/result">Results</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/project/futureplan">Future Plan</a></li>
+
          </ul>
+
        </li>
+
        <li class="dropdown">
+
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Notebook</a>
+
          <ul class="dropdown-menu" role="menu">
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/notebook/lablog">Lab Log</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/notebook/protocols">Protocol</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/notebook/safety">Safety</a></li>
+
          </ul>
+
        </li>
+
        <li class="dropdown">
+
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Achievement</a>
+
          <ul class="dropdown-menu" role="menu">
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/achievement/medal_requirement">Medal Fulfillment</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/achievement/new_biobrick">New Biobricks</a></li>
+
          </ul>
+
        </li>
+
        <li class="dropdown">
+
          <a href="#" class="dropdown-toggle" data-toggle="dropdown">Human Practice</a>
+
          <ul class="dropdown-menu" role="menu">
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/HumanPractice">Outreach</a></li>
+
            <li><a href="https://2014.igem.org/Team:CityU_HK/collaboration">Collaborations</a></li>
+
          </ul>
+
        </li>
+
      </ul>
+
    </div><!-- /.navbar-collapse -->
+
  </div><!-- /.container-fluid -->
+
</nav>
+
  
 +
a {
 +
color: #C13832;
 +
}
  
 +
a:hover {
 +
color: $HoverColor;
 +
}
  
<!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
+
h2 {
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
+
font-size: 19px;
    <!-- Include all compiled plugins (below), or include individual files as needed -->
+
padding: .8em 0 .2em 0;
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
+
line-height: 1.2;
 +
font-weight: normal;
 +
color: #333;
 +
margin-bottom:20px;
 +
}
  
<!--// Smooth scroll for in page links-->   
+
.weebly-text h1, h2, h3, h4, h5, h6 {font-family: Georgia, serif;}
    <script>
+
      $(document).ready(function() {
+
      $('#btn-custom').click(function() {
+
        $('html,body').animate({
+
          scrollTop:$($.attr(this,'href')).offset().top},500);
+
            return false;
+
        });
+
      });
+
   
+
// bootstrap navbar hover dropdown
+
    $(function(){
+
        $('.dropdown').hover(function() {
+
            $(this).toggleClass('open');
+
            });
+
    });
+
    </script>
+
  
 +
p, blockquote {
 +
color:#777;
 +
font: 12px/22px Arial,sans-serif;
 +
}
  
  </body>
+
blockquote {
 +
color:#aaa;
 +
}
 +
 
 +
 
 +
 
 +
/* Header
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#nav-wrap .container,
 +
#nav-wrap .container table {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
width:946px;
 +
}
 +
 
 +
#wsite-title {
 +
    font-size:20px;
 +
color:#555;
 +
line-height:38px;
 +
float:left;
 +
font-style:italic;
 +
font-weight:bold;
 +
}
 +
 
 +
#wsite-title:hover {
 +
color:$HoverColor;
 +
}
 +
 
 +
#header {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
text-align:right;
 +
height:100px;
 +
    width:100%;
 +
}
 +
 
 +
#header,
 +
#header table {
 +
border-collapse: collapse;
 +
border-spacing: 0;
 +
}
 +
 
 +
#header td {
 +
vertical-align: middle;
 +
text-align: left;
 +
}
 +
 
 +
#header-right {
 +
border-spacing:0;
 +
padding:0;
 +
}
 +
 
 +
#header-right table {
 +
float:right;
 +
width:1px;
 +
}
 +
 
 +
#header-right td {
 +
padding: 0 0 0 0;
 +
}
 +
 
 +
/* Header: Phone Number
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#header-right .phone-number .wsite-text {
 +
font-weight: 300;
 +
font-size:13px;
 +
display: block;
 +
white-space: nowrap;
 +
line-height: 31px;
 +
margin: 0 0 0 10px;
 +
text-align: right;
 +
}
 +
 
 +
#header-right .phone-number .wsite-text a {}
 +
#header-right .phone-number .wsite-text a:hover {}
 +
 
 +
/* Header: Social Links
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#header-right .wsite-social {
 +
vertical-align: middle;
 +
margin-left:15px;
 +
}
 +
 
 +
 
 +
.wsite-social-item {
 +
width: 28px;
 +
height: 30px;
 +
margin: 1px 0 0 4px;
 +
}
 +
 
 +
.wsite-social-rss {
 +
background: url(social-icons.png) no-repeat -130px 0px;
 +
}
 +
 
 +
.wsite-social-rss:hover {
 +
background-position: -130px -30px;
 +
}
 +
 
 +
.wsite-social-rss:active {
 +
background-position: -130px -60px;
 +
}
 +
 
 +
.wsite-social-linkedin {
 +
background: url(social-icons.png) no-repeat -65px 0px;
 +
}
 +
 
 +
.wsite-social-linkedin:hover {
 +
background-position: -65px -30px;
 +
}
 +
 
 +
.wsite-social-linkedin:active {
 +
background-position: -65px -60px;
 +
}
 +
 
 +
.wsite-social-facebook {
 +
background: url(social-icons.png) no-repeat 0px 0px;
 +
}
 +
 
 +
.wsite-social-facebook:hover {
 +
background-position: 0px -30px;
 +
}
 +
 
 +
.wsite-social-facebook:active {
 +
background-position: 0px -60px;
 +
}
 +
 
 +
.wsite-social-twitter {
 +
background: url(social-icons.png) no-repeat -32px 0px;
 +
}
 +
 
 +
.wsite-social-twitter:hover {
 +
background-position: -32px -30px;
 +
}
 +
 
 +
.wsite-social-twitter:active {
 +
background-position: -32px -60px;
 +
}
 +
 
 +
.wsite-social-mail {
 +
background: url(social-icons.png) no-repeat -97px 0px;
 +
}
 +
 
 +
.wsite-social-mail:hover {
 +
background-position: -97px -30px;
 +
}
 +
 
 +
.wsite-social-mail:active {
 +
background-position: -97px -60px;
 +
}
 +
 
 +
.wsite-social-pinterest {
 +
background: url(social-icons.png) no-repeat -227px 0px;
 +
}
 +
 
 +
.wsite-social-pinterest:hover {
 +
background-position: -227px -30px;
 +
}
 +
 
 +
.wsite-social-pinterest:active {
 +
background-position: -227px -60px;
 +
}
 +
 
 +
.wsite-social-youtube {
 +
background: url(social-icons.png) no-repeat -325px 0px;
 +
}
 +
 
 +
.wsite-social-youtube:hover {
 +
background-position: -325px -30px;
 +
}
 +
 
 +
.wsite-social-youtube:active {
 +
background-position: -325px -60px;
 +
}
 +
 
 +
.wsite-social-plus {
 +
background: url(social-icons.png) no-repeat -195px 0px;
 +
}
 +
 
 +
.wsite-social-plus:hover {
 +
background-position: -195px -30px;
 +
}
 +
 
 +
.wsite-social-plus:active {
 +
background-position: -195px -60px;
 +
}
 +
 
 +
.wsite-social-flickr {
 +
background: url(social-icons.png) no-repeat -162px 0px;
 +
}
 +
 
 +
.wsite-social-flickr:hover {
 +
background-position: -162px -30px;
 +
}
 +
 
 +
.wsite-social-flickr:active {
 +
background-position: -162px -60px;
 +
}
 +
 
 +
.wsite-social-vimeo {
 +
background: url(social-icons.png) no-repeat -260px 0px;
 +
}
 +
 
 +
.wsite-social-vimeo:hover {
 +
background-position: -260px -30px;
 +
}
 +
 
 +
.wsite-social-vimeo:active {
 +
background-position: -260px -60px;
 +
}
 +
 
 +
.wsite-social-yahoo {
 +
background: url(social-icons.png) no-repeat -292px 0px;
 +
}
 +
 
 +
.wsite-social-yahoo:hover {
 +
background-position: -292px -30px;
 +
}
 +
 
 +
.wsite-social-yahoo:active {
 +
background-position: -292px -60px;
 +
}
 +
 
 +
/* Header: Search Box
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#header-right .search {
 +
width:182px;
 +
vertical-align: middle;
 +
}
 +
 
 +
#header-right .wsite-search {
 +
vertical-align: middle;
 +
margin-left:15px;
 +
width:182px;
 +
height:28px;
 +
background:url(search-bg.gif) no-repeat top left;
 +
}
 +
 
 +
#header-right .wsite-search-input {
 +
width: 145px;
 +
border: none;
 +
padding: 6px !important;
 +
color: #999999;
 +
font-size: 12px ;
 +
background: none;
 +
height:auto !important;
 +
}
 +
 
 +
#header-right .wsite-search-button {
 +
position: relative;
 +
width: 14px;
 +
height: 14px;
 +
border: 0px;
 +
margin: 7px 0px 0px 5px;
 +
padding: ;
 +
background: url(search-button.gif) no-repeat right center;
 +
}
 +
 
 +
/* Navigation
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#nav-wrap .container {
 +
clear: both;
 +
overflow: hidden;
 +
position: relative;
 +
}
 +
 
 +
#nav-wrap .container table, #nav-wrap .container table tr, #nav-wrap .container table tr td, #nav-wrap .container table tbody {
 +
vertical-align:bottom;
 +
}
 +
 
 +
td#nav {
 +
float:right;
 +
border-spacing:0;
 +
}
 +
#navigation {
 +
line-height: 1;
 +
float: right;
 +
}
 +
 
 +
#navigation ul {
 +
list-style: none;
 +
float: left;
 +
width:946px;
 +
height:44px;
 +
margin-bottom:-1px;
 +
}
 +
 
 +
#navigation li {
 +
display: inline;
 +
position: relative;
 +
list-style: none;
 +
float: left;
 +
margin:0 0 0 5px;
 +
}
 +
 
 +
#navigation li.wsite-nav-0 {margin-left:0;}
 +
 
 +
#navigation ul li a {
 +
display: block;
 +
color: #333;
 +
text-decoration: none;
 +
padding:4px 0 4px 0;
 +
margin:0;
 +
width:130px;
 +
border: 0;
 +
outline: 0;
 +
list-style-type: none;
 +
box-sizing:border-box;
 +
float: left;
 +
font:13px Georgia, serif;
 +
border-top:4px solid #939598;
 +
}
 +
 
 +
#navigation ul li#active a{
 +
border-top:4px solid #C13832;
 +
color:#000;
 +
}
 +
 
 +
#navigation ul li a:hover {
 +
border-top:4px solid #404041;
 +
color: #666;
 +
}
 +
 
 +
/* Navigation Submenu's
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#wsite-menus .wsite-menu {
 +
background:#fff;
 +
box-shadow:0 1px 7px rgba(0,0,0,0.1);
 +
position:relative;
 +
}
 +
 
 +
 
 +
#wsite-menus .wsite-menu li a {
 +
background: #F4F4F4;
 +
border:none;
 +
border-bottom: 1px solid #E8E8E8;
 +
border-top: 1px solid white;
 +
display: block;
 +
}
 +
 
 +
#wsite-menus .wsite-menu li a:hover {
 +
color: #C13832;
 +
background: #eee;
 +
}
 +
 
 +
 
 +
 
 +
/* Universal banner
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#banner {
 +
position:relative;
 +
}
 +
 
 +
#banner-image-wrap {
 +
position:relative
 +
}
 +
 
 +
/* Page type: Tall header
 +
--------------------------------------------------------------------------------*/
 +
 
 +
 
 +
.tall-header-page #banner-image-wrap {
 +
width: 100%;
 +
height: 250px;
 +
}
 +
 
 +
.tall-header-page .wsite-header {
 +
width: 100%;
 +
height: 250px;
 +
background: url(banner-tall.jpg) no-repeat;
 +
}
 +
 
 +
/* Page type: Short header
 +
--------------------------------------------------------------------------------*/
 +
 
 +
 
 +
.short-header-page #banner-image-wrap {
 +
width: 100%;
 +
height: 100px;
 +
}
 +
 
 +
.short-header-page .wsite-header {
 +
width: 100%;
 +
height: 100px;
 +
background: url(banner-short.jpg) no-repeat;
 +
}
 +
 
 +
/* Page type: No header
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.no-header-page #banner, .no-header-page .wsite-header  {
 +
        display:none;
 +
}
 +
 
 +
/* Page type: Landing page
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.landing-page #banner {}
 +
 
 +
#bannerleft {
 +
width: 946px;
 +
height: 400px;
 +
float:right;
 +
position:relative;
 +
}
 +
 
 +
.landing-page .wsite-header {
 +
width: 100%;
 +
height: 400px;
 +
background: url(banner-tall.jpg) no-repeat;
 +
}
 +
 
 +
#bannerright {
 +
width: 420px;
 +
text-align:left;
 +
position:absolute;
 +
z-index:4;
 +
bottom:30px;
 +
right:30px;
 +
padding:23px 20px 20px;
 +
background:#C13832;
 +
}
 +
 
 +
#bannerright h2 {
 +
color: #fff;
 +
font:bold italic 24px Georgia, serif;
 +
padding: 0px;
 +
line-height: 24px;
 +
margin:0px;
 +
}
 +
 
 +
#bannerright .anchor {
 +
position:absolute;
 +
background:#C13832;
 +
width:30px;
 +
height:7px;
 +
bottom:-7px;
 +
left:-30px;
 +
}
 +
#bannerright p {
 +
padding: 20px 0px;
 +
line-height: 140%;
 +
color:#fff;
 +
font: 14px/19px Georgia, serif;
 +
}
 +
#bannerright p a, #bannerright h2 a {
 +
color:#fff;
 +
text-decoration:underline;
 +
}
 +
 
 +
.landing-banner-outer {
 +
display: table;
 +
#position: relative;
 +
overflow: hidden;
 +
}
 +
 
 +
.landing-banner-mid {
 +
#position: absolute;
 +
#top: 50%;
 +
display: table-cell;
 +
vertical-align: middle;
 +
}
 +
 
 +
.landing-banner-inner {
 +
#position: relative;
 +
#top: -50%;
 +
}
 +
 
 +
/* Main Content
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#main-wrap .container {
 +
min-height:400px;
 +
padding-top:10px;
 +
padding-bottom:20px;
 +
}
 +
 
 +
#main-wrap .container h2 {
 +
margin-bottom:10px;
 +
}
 +
 
 +
#main-wrap .container blockquote {
 +
font-family: 'Droid Serif', serif;
 +
font-style: italic;
 +
color:# 777777;
 +
padding-left:15px;
 +
border-left:3px solid #eeeeee;
 +
margin: 15px 0px;
 +
}
 +
 
 +
#main-wrap .container form .wsite-button {
 +
margin-top:50px;
 +
}
 +
 
 +
/* Footer
 +
--------------------------------------------------------------------------------*/
 +
 
 +
#footer-wrap {
 +
margin-top:25px;
 +
}
 +
#footer-wrap .container {
 +
text-align:left;
 +
padding:0 0px 20px;
 +
text-align:right;
 +
background:none;
 +
}
 +
 
 +
#footer-wrap ul {
 +
text-align:left;
 +
}
 +
 
 +
 
 +
#footer-wrap h2 {
 +
font-size: 19px;
 +
padding-bottom:10px;
 +
margin:0;
 +
font-weight: normal;
 +
color:#333;
 +
}
 +
 
 +
#footer-wrap span {
 +
vertical-align: middle;
 +
}
 +
 
 +
/* Form Customization
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.wsite-form-label {
 +
display: inline-block;
 +
color: #797979;
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 1em;
 +
padding: 6px 0 0px 0;
 +
}
 +
 
 +
.form-radio-container {
 +
color: #797979;
 +
font-size: 1em;
 +
font-family: Arial, Helvetica, sans-serif;
 +
}
 +
 
 +
.wsite-form-input, .wsite-search-element-input {
 +
font-family: Arial, Helvetica, sans-serif;
 +
font-size: 1em;
 +
color: #797979;
 +
background: #fff url(field.png) repeat-x;
 +
border: 1px solid #d4d4d4;
 +
padding: 8px 4px 5px !important;
 +
line-height: 1;
 +
-webkit-border-radius: 3px;
 +
-moz-border-radius: 3px;
 +
border-radius: 3px;
 +
}
 +
 
 +
.form-select {
 +
color: #797979;
 +
background: url#fff (field.png);
 +
border: 1px solid #d4d4d4;
 +
font-size: 1em;
 +
font-family: Arial, Helvetica, sans-serif;
 +
padding: 3px 4px;
 +
width: 320px;
 +
height: 27px;
 +
line-height: 27px;
 +
-webkit-border-radius: 3px;
 +
-moz-border-radius: 3px;
 +
border-radius: 3px;
 +
}
 +
 
 +
.form-radio-container {
 +
font-size:.9em;
 +
min-height:20px;
 +
padding:0;
 +
margin:0 0 5px 0 !important;
 +
}
 +
 
 +
/* Footer Form Customization
 +
--------------------------------------------------------------------------------*/
 +
 
 +
.wsite-form-container {
 +
margin-top:0px !important;
 +
text-align:left;
 +
}
 +
 
 +
.wsite-footer .wsite-form-label {
 +
font-size: 1em;
 +
padding: 5px 0 2px 0;
 +
}
 +
 
 +
.wsite-footer .wsite-form-field {
 +
width:350px !important;
 +
}
 +
 
 +
 
 +
.wsite-footer .wsite-form-input {
 +
font-size: 1em;
 +
width: 100% !important;
 +
}
 +
 
 +
.wsite-footer .form-select {
 +
width: 100%;
 +
}
 +
/* Buttons
 +
--------------------------------------------------------------------------------*/
 +
 
 +
/* Small structure & regular style */
 +
 
 +
.wsite-button {
 +
background: #333;
 +
color: white !important;
 +
font-size: 13px;
 +
font-weight: 700;
 +
padding: 0 10px 0 0;
 +
text-align: center;
 +
text-decoration: none !important;
 +
}
 +
 
 +
.wsite-button:hover {
 +
background-position:0 0;
 +
background:#000;
 +
}
 +
 
 +
.wsite-button:active {
 +
background-position:0 0;
 +
}
 +
 
 +
.wsite-button-inner {
 +
color: #fff !important;
 +
padding:3px 15px 3px 15px;
 +
background: #222;
 +
}
 +
 
 +
.wsite-button:hover .wsite-button-inner {
 +
}
 +
 
 +
.wsite-button:active {}
 +
 
 +
/* Large structure & regular style  */
 +
 
 +
.wsite-button-large {
 +
font-size:14px;
 +
background: #333;
 +
}
 +
.wsite-button-large:hover {
 +
font-size:14px;
 +
background:#000;
 +
}
 +
 
 +
.wsite-button-large .wsite-button-inner {
 +
font-size:14px;
 +
padding:8px 15px 8px 15px;
 +
background: #222;
 +
}
 +
 
 +
/* Highlighted styles */
 +
 
 +
.wsite-button-highlight, .wsite-button-large.wsite-button-highlight {
 +
background: #931C18;
 +
}
 +
 
 +
.wsite-button-highlight:hover , .wsite-button-large.wsite-button-highlight:hover {
 +
background: #61120F;
 +
}
 +
 
 +
.wsite-button-highlight .wsite-button-inner {
 +
background-image: none;
 +
background: #7F1714;
 +
}
 +
 
 +
.wsite-button-large.wsite-button-highlight .wsite-button-inner {
 +
background-image: none;
 +
background: #7F1714;
 +
}
 +
 
 +
</style>
 
</html>
 
</html>

Revision as of 10:08, 12 July 2015

City University of Hong Kong 2015 - Home