Team:Glendale CC AZ/css.main

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<style>
<style>
-
body
+
body {
-
{
+
margin: 0;
-
  background: url('http://uploadfa.net/uploads/13490193031.png') repeat;
+
background-color: #1d1d1d;
-
}
+
font-family: Trebuchet MS;
 +
max-width: 100%;
 +
min-width: 100px;
 +
}
 +
 +
#header {
 +
background-color: #cc3333;
 +
height: 55px;
 +
box-shadow: inset 0px -3px 0px #663333;
 +
padding: 0;
 +
margin: 0;
 +
}
-
aside
+
#navtainer {
-
{
+
width: 100%;
-
  margin-left: 139px;
+
position: relative;
-
  width: 220px;
+
padding: 0;
-
  height: 270px;
+
margin: 0;
-
  background-color: #fff;
+
}
-
  border: solid thin rgb(223,223,223);
+
-
  padding-top: 38px;
+
-
  margin-top: 23px;
+
-
  font-family: Arial;
+
-
}
+
-
li
+
#navtainer ul {
-
{
+
list-style-type: none;
-
  padding: 9px 0 8px 26px;
+
padding: 0;
-
  margin: 10px 0 9px 0;
+
margin: 0;
-
  cursor: pointer;
+
height: 55px;
-
  color: #000;
+
position: absolute;
-
  transition: color .3s linear;
+
right: 15%;
-
  -webkit-transition: color .3s linear;
+
}
-
  -moz-transition: color .3s linear;
+
-
  -o-transition: color .3s linear;
+
-
}
+
-
li:not(.active):hover
+
#navtainer ul li {
-
{
+
float: left;
-
  color: rgb(1,185,255);
+
height: 55px;
-
}
+
padding: 0;
 +
margin: 0;
 +
}
-
a
+
#navtainer ul li a {
-
{
+
margin: 0;
-
  text-decoration: none;
+
padding: 0 15px 0 15px;
-
  color: inherit;
+
line-height: 55px;
-
}
+
text-decoration: none;
-
 
+
color: #fff;
-
.active
+
}
-
{
+
-
  background-color: rgb(1,185,255);
+
-
  background-position: left center;
+
-
  border-left: solid 15px rgb(0,149,205);
+
-
  position: relative;
+
-
  left: -15px;
+
-
  color: #fff;
+
-
}
+
</style>
</style>
<head>
<head>
Line 57: Line 54:
<body>
<body>
-
<aside>
+
<div id="header">
-
  <ul>
+
<div id="navtainer">
-
    <li class="active"><a href="#">Profile Settings</a></li>
+
<ul>
-
    <li><a href="#">Connected Networks</a></li>
+
<li><a href="#">home</a></li>
-
    <li><a href="#">Email Settings</a></li>
+
<li><a href="#">about</a></li>
-
    <li><a href="#">Privacy Settings</a></li>
+
<li><a href="#">services</a></li>
-
    <li><a href="#">Authurized Sites</a></li>
+
<li><a href="#">portfolio</a></li>
-
  </ul>
+
<li><a href="#">blog</a></li>
-
</aside>
+
<li><a href="#">contact</a></li>
 +
</ul>
 +
</div>
 +
</div>
</body>
</body>

Revision as of 07:26, 12 August 2013

Test