Template:Team:DukeHomePage/CSS

From 2014.igem.org

(Difference between revisions)
 
(243 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 32: Line 36:
#menubar a:hover{
#menubar a:hover{
text-decoration:none;
text-decoration:none;
-
color:#52749C;
+
color:#fff;
}
}
Line 43: Line 47:
.right-menu ul li a {
.right-menu ul li a {
-
background-color:#CCC;
+
background-color:#000;
}
}
Line 51: Line 55:
#footer-box {
#footer-box {
-
border:none;
+
display:none;
}
}
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;
}
}
 +
#bodyContent a {
 +
text-decoration:none;
 +
color:#fff;
 +
}
 +
 +
 +
/*This formats the stuff at the bottom. */
body {
body {
background-color:#000;
background-color:#000;
 +
}
 +
 +
/* Title font */
 +
.big {
 +
font-size: 4em;
 +
color:#fff;
 +
text-transform:uppercase;
 +
text-align:center;
 +
float:center;
 +
padding-bottom:0px;
 +
}
 +
 +
/* Makes the square buttons */     
 +
.sq-button {
 +
    display:block;
 +
    width:100px;
 +
    height:100px;
 +
    border:none;
 +
    line-height:50px;
 +
    color:#f5f5f5;
 +
    text-align:center;
 +
    text-decoration:none;
 +
    opacity: 1;
 +
    background: #0736A4;
 +
    font-size:16px;
 +
    font-weight:bold;
 +
    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%;
 +
}
 +
 +
.sq-button span {
 +
    display: table-cell;
 +
    text-align: center;
 +
    vertical-align: middle;
 +
}
 +
 +
.sq-button:hover {
 +
    background-color: #0000ff;
 +
    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);
 +
}
 +
 +
/* So the logo is out of the way */
 +
.logo {
 +
z-index:200;
 +
padding:20px;
 +
margin: 0px 100px 0px 0px;
}
}
.main {
.main {
-
position:relative;
+
position:relative;
-
z-index:200;
+
z-index:100;
-
padding:20px;
+
padding:20px;
-
        text-align:center;
+
text-align:center;
}
}
-
h1 {
+
img.mainpic {
-
color:#f00;
+
display:block;
 +
text-align:center;
 +
float:center;
 +
padding-bottom: 10px;
}
}
 +
</style>
</style>
Line 97: Line 178:
</head>
</head>
-
 
<body>
<body>
<div class="main">
<div class="main">
-
<p>
+
<p class="big">
-
Hi
+
Demonstrating Ultrasensitivity
</p>
</p>
 +
<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>
 +
<!--https://2014.igem.org/File:Mattigemlogowhite.png or https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png -->
</div>
</div>
</body>
</body>
</html>
</html>

Latest revision as of 14:23, 28 August 2014

Demonstrating Ultrasensitivity