Team:UNIK Copenhagen/template

From 2013.igem.org

(Difference between revisions)
(Changing the design completely!!!)
 
(41 intermediate revisions not shown)
Line 2: Line 2:
<head>
<head>
<style type="text/css">
<style type="text/css">
 +
*{
*{
Line 24: Line 25:
body{
body{
-
background-color: #cccccc;
+
background-color: #cccccc;
-
background-image: url("https://static.igem.org/mediawiki/2013/b/ba/UNIK_Copenhagen_bg.png");
+
background-image: url("https://static.igem.org/mediawiki/2013/b/ba/UNIK_Copenhagen_bg.png");
width: 100%;
width: 100%;
margin: 0 auto;
margin: 0 auto;
position: relative;
position: relative;
-
background-attachment: fixed;
+
background-attachment: fixed;
}
}
#top-section {
#top-section {
Line 39: Line 40:
margin: 0px;
margin: 0px;
padding: 5px;
padding: 5px;
-
width: 100%;
+
width: 100%;
}
}
#menubar.left-menu ul{
#menubar.left-menu ul{
-
margin-left: -5px;
+
margin-left: -5px;
-
padding: 5px 3px 3px 5px;
+
padding: 5px 3px 3px 5px;
-
background: white;
+
background: white;
-
border-bottom-left-radius: 5px;
+
border-bottom-left-radius: 5px;
-
border-bottom-right-radius: 5px;
+
border-bottom-right-radius: 5px;
-
box-shadow: 0px 0px 5px #888888;
+
box-shadow: 0px 0px 5px #888888;
-
-webkit-box-shadow: 0px 0px 5px #888888;
+
-webkit-box-shadow: 0px 0px 5px #888888;
-
-moz-box-shadow: 0px 0px 5px #888888;
+
-moz-box-shadow: 0px 0px 5px #888888;
}
}
#menubar.left-menu{
#menubar.left-menu{
Line 55: Line 56:
}
}
#menubar.right-menu ul{
#menubar.right-menu ul{
-
padding: 5px 6px 3px 3px;
+
padding: 5px 6px 3px 3px;
}
}
#footer-box{
#footer-box{
Line 70: Line 71:
font-size: 12px;
font-size: 12px;
}
}
-
#footer{width: 900px; margin: 0px auto}
+
#footer{
-
#footer a{color: white;}
+
width: 900px;
 +
margin: 0px auto
 +
}
 +
#footer a{
 +
color: white;
 +
}
/*-------------------------------------------------------*/
/*-------------------------------------------------------*/
-
/*               Navigation Bar CSS                     */
+
/*                   Wrapper CSS                       */
/*-------------------------------------------------------*/
/*-------------------------------------------------------*/
#wrapper{
#wrapper{
-
display: block;
+
display: block;
-
position: relative;
+
position: relative;
width:964px;
width:964px;
-
min-height: 1000px;
+
min-height: 1000px;
margin: 45px auto -5px auto;
margin: 45px auto -5px auto;
-
padding: 0px 10px 60px 10px;
+
padding: 0px 10px 60px 10px;
z-index: 95;
z-index: 95;
-
background: white;
+
background: white;
-
top:-10px;
+
top:-10px;
-
border-radius: 5px;
+
border-radius: 5px;
-
box-shadow: 0px 0px 5px #888888;
+
box-shadow: 0px 0px 5px #888888;
-webkit-box-shadow: 0px 0px 5px #888888;
-webkit-box-shadow: 0px 0px 5px #888888;
-moz-box-shadow: 0px 0px 5px #888888;
-moz-box-shadow: 0px 0px 5px #888888;
}
}
 +
/*-------------------------------------------------------*/
 +
/*                Navigation Bar CSS                    */
 +
/*-------------------------------------------------------*/
#nav{
#nav{
-
display: block;
+
display: block;
-
width: 940px;
+
width: 940px;
-
height: 38px;
+
height: 38px;
-
margin: 0 auto;
+
margin: 0 auto;
-
border-bottom: 1px solid #cccccc;
+
border-bottom: 1px solid #cccccc;
-
border-top: 1px solid #cccccc;
+
border-top: 1px solid #cccccc;
}
}
#nav li{
#nav li{
Line 116: Line 125:
visibility: hidden;
visibility: hidden;
z-index: 95;
z-index: 95;
-
margin:1px 0px 0px 0px;
+
margin:1px 0px 0px 0px;
-
background: white;
+
background: white;
-
box-shadow: 0px 0px 2px #888888;
+
box-shadow: 0px 0px 2px #888888;
-
-webkit-box-shadow: 0px 0px 2px #888888;
+
-webkit-box-shadow: 0px 0px 2px #888888;
-
-moz-box-shadow: 0px 0px 2px #888888;
+
-moz-box-shadow: 0px 0px 2px #888888;
}
}
#nav ul ul li{
#nav ul ul li{
-
border: none;
+
border: none;
}
}
#nav ul li a{
#nav ul li a{
Line 131: Line 140:
text-decoration: none;
text-decoration: none;
display: block;
display: block;
-
height: 30px;
+
height: 30px;
color: #333333;
color: #333333;
-
padding: 0px 12px 0px 12px;
+
padding: 0px 10px 0px 10px;
margin: 0px;
margin: 0px;
z-index: 95;
z-index: 95;
Line 151: Line 160:
}
}
#nav li:hover{
#nav li:hover{
-
border-bottom: 1px solid #990000;
+
border-bottom: 1px solid #990000;
-
border-top: 1px solid #990000;
+
border-top: 1px solid #990000;
}
}
#nav li:hover a{
#nav li:hover a{
Line 158: Line 167:
}
}
#nav li li:hover{
#nav li li:hover{
-
border: none;
+
border: none;
}
}
#nav ul li:hover ul li a{
#nav ul li:hover ul li a{
Line 168: Line 177:
}
}
 +
/*-------------------------------------------------------*/
 +
/*      Social Media  (hide facebook-count)            */
 +
/*-------------------------------------------------------*/
 +
#social_media{
 +
position: absolute;
 +
top: 150px;
 +
right: 30px;
 +
text-align: right;
 +
}
/*-------------------------------------------------------*/
/*-------------------------------------------------------*/
/*                        Fonts                          */
/*                        Fonts                          */
Line 206: Line 224:
display:block;
display:block;
position: relative;
position: relative;
-
padding: 20px 20px 40px 20px;
+
padding: 20px 20px 60px 20px;
-
background: rgba(255, 255, 255, 0.6);;
+
}
}
#article{
#article{
Line 223: Line 240:
margin: 10px;
margin: 10px;
font-size:14px;
font-size:14px;
-
font-family: Helvetica Neue;
+
font-family: Baskerville;
-
line-height: 21px;
+
line-height: 18px;
padding-left: 15px;
padding-left: 15px;
margin-bottom: 20px;
margin-bottom: 20px;
Line 251: Line 268:
/*-------------------------------------------------------*/
/*-------------------------------------------------------*/
#two_logos{
#two_logos{
-
height: 140px;
+
height: 140px;
}
}
#our_logo{
#our_logo{
-
display: inline-block;
+
display: inline-block;
-
position: relative;
+
position: relative;
-
float: left;
+
float: left;
margin: 30px 0px 0px 15px;
margin: 30px 0px 0px 15px;
}
}
#iGEM_logo{
#iGEM_logo{
-
display: inline-block;
+
display: inline-block;
-
float: right;
+
float: right;
position:relative;
position:relative;
margin: 15px 15px 0px 0px;
margin: 15px 15px 0px 0px;
-
top: 0px;
+
top: 0px;
}
}
#iGEM{
#iGEM{
Line 285: Line 302:
-webkit-transition-duration: 1s;
-webkit-transition-duration: 1s;
-
    -moz-transition-duration: 1s;
+
-moz-transition-duration: 1s;
-
    -o-transition-duration: 1s;
+
-o-transition-duration: 1s;
-
    transition-duration: 1s;
+
transition-duration: 1s;
-webkit-transform: rotate(0deg);  
-webkit-transform: rotate(0deg);  
Line 294: Line 311:
-ms-transform: rotate(0deg);  
-ms-transform: rotate(0deg);  
-
    -webkit-transition-property: -webkit-transform;
+
-webkit-transition-property: -webkit-transform;
-
    -moz-transition-property: -moz-transform;
+
-moz-transition-property: -moz-transform;
-
    -o-transition-property: -o-transform;
+
-o-transition-property: -o-transform;
-
    transition-property: transform;
+
transition-property: transform;
}
}
#no_wheel:hover + #wheel{  
#no_wheel:hover + #wheel{  
-
-webkit-transform: rotate(360deg);  
+
-webkit-transform: rotate(360deg);  
-
-moz-transform: rotate(360deg);  
+
-moz-transform: rotate(360deg);  
-
-o-transform: rotate(360deg);
+
-o-transform: rotate(360deg);
-
-ms-transform: rotate(360deg);
+
-ms-transform: rotate(360deg);
z-index: -1;
z-index: -1;
}
}
 +
</style>
 +
 +
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
 +
 +
<div id="fb-root"></div>
 +
<script>(function(d, s, id) {
 +
  var js, fjs = d.getElementsByTagName(s)[0];
 +
  if (d.getElementById(id)) return;
 +
  js = d.createElement(s); js.id = id;
 +
  js.src = "//connect.facebook.net/en_GB/all.js#xfbml=1";
 +
  fjs.parentNode.insertBefore(js, fjs);
 +
}(document, 'script', 'facebook-jssdk'));</script>
 +
 +
 +
-
/*-------------------------------------------------------*/
 
-
/*              Navigation Bar HTML                    */
 
-
/*-------------------------------------------------------*/
 
-
</style>
 
</head>
</head>
<body>
<body>
Line 326: Line 354:
<div id="nav">
<div id="nav">
<ul>
<ul>
-
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Signe/Home">Home</a></li>
+
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen">Home</a></li>
<li><a href="#">Project</a>
<li><a href="#">Project</a>
<ul>
<ul>
-
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Signe/Project">Overview</a></li>
+
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Project">Overview</a></li>
-
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Signe/ExperimentalApproach">Experimental Approach</a></li>
+
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/ExperimentalApproach">Experimental Approach</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Results">Results</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Results">Results</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Project/Applications">Applications</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Project/Applications">Applications</a></li>
Line 339: Line 367:
<li><a href="#">Team</a>
<li><a href="#">Team</a>
<ul>
<ul>
-
<li><a href="https://igem.org/Team.cgi">Official Team Profile</a></li>
+
<li><a href="https://igem.org/Team.cgi?id=1094">Official Team Profile</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Team">Meet the team</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Team">Meet the team</a></li>
 +
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Danish_collaboration">The Danish Collaboration</a></li>
</ul></li>
</ul></li>
<li><a href="#">Safety and Ethics</a><ul>
<li><a href="#">Safety and Ethics</a><ul>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Safety">Safety</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Safety">Safety</a></li>
-
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/OpenSource">Open Source</a></li>
+
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/OpenSource">Ethics</a></li>
-
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Outreach">Outreach Activities</a></li>
+
</ul></li>
</ul></li>
<li><a href="#">Bricks of Knowledge</a><ul>
<li><a href="#">Bricks of Knowledge</a><ul>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/BricksOfKnowledge">Invitation</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/BricksOfKnowledge">Invitation</a></li>
-
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/BricksOfKnowledgeMovieBricks">Recieved Movie-Bricks</a></li>
+
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/BricksOfKnowledgeMovieBricks">Bricks of Knowledge</a></li>
-
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/BricksOfKnowledgeMovie">BoK -the movie</a></li>
+
</ul></li>
</ul></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/TheCphStrain">The CPH Strain</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/TheCphStrain">The CPH Strain</a></li>
 +
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Press">Press</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Sponsors">Sponsors</a></li>
<li><a href="https://2013.igem.org/Team:UNIK_Copenhagen/Sponsors">Sponsors</a></li>
</ul>
</ul>
 +
<div id="social_media">
 +
<a href="https://twitter.com/iGEMCopenhagen" class="twitter-follow-button" data-show-screen-name="false" data-show-count="false" data-lang="en">Follow @twitterapi</a>
 +
 +
<a href="https://twitter.com/iGEMCopenhagen" class="twitter-share-button" data-count="none"  data-lang="en">Tweet</a>
 +
 +
<div class="fb-like" data-href="https://www.facebook.com/pages/IGEM-Copenhagen-2013/1393917120824679?fref=ts" data-width="The pixel width of the plugin" data-height="25" data-colorscheme="light" data-layout="button_count" data-action="like" data-show-faces="false" data-send="false"></div>
 +
</div>
 +
</div>
</div>

Latest revision as of 14:28, 4 October 2013