Template:Team:DukeHomePage/CSS

From 2014.igem.org

(Difference between revisions)
 
(167 intermediate revisions not shown)
Line 1: Line 1:
 +
<html xmlns="http://www.w3.org/1999/xhtml">
 +
 +
<head>
 +
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<html xmlns="http://www.w3.org/1999/xhtml">
<html xmlns="http://www.w3.org/1999/xhtml">
Line 5: Line 9:
<style media="screen" type="text/css">
<style media="screen" type="text/css">
-
/*hide default igem banner and reformat style into blank slate - from UVA 2013*/
+
/*hide default igem banner and reformat style into blank slate - modified from UVA 2013*/
#globalWrapper {
#globalWrapper {
Line 67: Line 71:
background-color:#000;
background-color:#000;
}
}
 +
</style>
 +
 +
 +
<!--BEGIN HERE: This comment marks where actual coding on the main part of the page begins.-->
 +
 +
<style media="screen" type="text/css">
-
/*This "bodyContent" style rule controls what the formatting of the page looks like, not body, for some reason. MediaWiki logic, amirite? Also, this comment marks where my (not UVA's) code begins.*/
+
/*This "bodyContent" style rule controls what the formatting of the page looks like, not body, for some reason. MediaWiki logic, amirite?*/
#bodyContent {
#bodyContent {
border:none;
border:none;
background-color:#000;
background-color:#000;
-
color:#fff;
+
font-color:#fff;
font-size: 1em;
font-size: 1em;
 +
font-family: Futura, Helvetica;
}
}
-
body {
+
#bodyContent a {
-
background-color:#000;
+
text-decoration:none;
 +
color:#fff;
}
}
-
.main {
 
-
position:relative;
 
-
z-index:200;
 
-
padding:20px;
 
-
text-align:center;
 
-
}
 
-
.cthru  {
+
/*This formats the stuff at the bottom. */
-
opacity:0.6;
+
body {
-
background-color: #fff;
+
background-color:#000;
-
margin: 0px 50px;
+
}
}
 +
/* Title font */
.big {
.big {
-
font-size: 6em;
+
font-size: 4em;
color:#fff;
color:#fff;
text-transform:uppercase;
text-transform:uppercase;
text-align:center;
text-align:center;
 +
float:center;
 +
padding-bottom:0px;
}
}
-
     
+
 
-
.round-button {
+
/* Makes the square buttons */     
 +
.sq-button {
     display:block;
     display:block;
     width:100px;
     width:100px;
     height:100px;
     height:100px;
 +
    border:none;
     line-height:50px;
     line-height:50px;
-
    border: 2px solid #f5f5f5;
 
-
    border-radius: 50%;
 
     color:#f5f5f5;
     color:#f5f5f5;
     text-align:center;
     text-align:center;
     text-decoration:none;
     text-decoration:none;
-
     opacity: 0.6;
+
     opacity: 1;
-
     background: #464646;
+
     background: #0736A4;
-
    box-shadow: 0 0 3px gray;
+
     font-size:16px;
-
     font-size:20px;
+
     font-weight:bold;
     font-weight:bold;
     overflow:hidden;
     overflow:hidden;
 +
    -webkit-transition: all 0.5s ease;
 +
    -moz-transition: all 0.5s ease;
 +
    -o-transition: all 0.5s ease;
 +
/*margins must be half of the change in size*/   
 +
    margin: 5px 5px;
 +
    line-height:200%;
}
}
-
.round-button:hover {
+
.sq-button span {
-
     background: #000;
+
    display: table-cell;
 +
    text-align: center;
 +
    vertical-align: middle;
 +
}
 +
 
 +
.sq-button:hover {
 +
     background-color: #0000ff;
     opacity: 1;
     opacity: 1;
 +
    width: 110px;
 +
    height: 110px;
 +
/*margins must be negative half of the change in size*/
 +
    margin: -5px -5px;
 +
/* Glow effect */
 +
  -webkit-box-shadow: 0px 0px 20px rgba(7, 54, 164, 0);
 +
  -moz-box-shadow: 0px 0px 20px rgba(7, 54, 164, 0;
 +
  box-shadow: 0px 0px 20px rgba(7, 54, 164, 0);
}
}
-
table {
+
/* So the logo is out of the way */
-
background-color:#000;
+
.logo {
-
width:75%;
+
z-index:200;
 +
padding:20px;
 +
margin: 0px 100px 0px 0px;
 +
}
 +
 
 +
.main {
 +
position:relative;
 +
z-index:100;
 +
padding:20px;
 +
text-align:center;
 +
}
 +
 
 +
img.mainpic {
 +
display:block;
 +
text-align:center;
 +
float:center;
 +
padding-bottom: 10px;
}
}
Line 135: Line 178:
</head>
</head>
-
 
<body>
<body>
-
<img src="https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png " align="right" alt="Duke iGEM" height="300px" width="300px">
+
<div class="main">
-
<!--black logo can be found here: https://static.igem.org/mediawiki/2014/c/ce/Mattigemlogo.png -->
+
-
<!--white logo can be found here: https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png -->
+
-
 
+
-
<br />
+
<p class="big">
<p class="big">
-
Demonstrating cooperative repression
+
Demonstrating Ultrasensitivity
</p>
</p>
-
<br />
+
<center><a href="https://2014.igem.org"><img class="mainpic" src="https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png" width="400px" height="400px" /></a></center>
-
<table class="buttonmenu" align="center">
+
<!--https://2014.igem.org/File:Mattigemlogowhite.png or https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png -->
-
<tr>
+
</div>
-
<td width="150px"><a class="round-button"> </a></td>
+
-
<td width="150px"><a class="round-button"> </a></td>
+
-
<td width="150px"><a class="round-button"> </a></td>
+
-
<td width="150px"><a class="round-button"> </a></td>
+
-
</tr>
+
-
</table>
+
-
<div></div>
+
-
 
+
</body>
</body>
</html>
</html>

Latest revision as of 14:23, 28 August 2014

Demonstrating Ultrasensitivity

Retrieved from "http://2014.igem.org/Template:Team:DukeHomePage/CSS"