Team:TU-Delft/Templates/Style

From 2013.igem.org

(Difference between revisions)
Line 1: Line 1:
<html>
<html>
<style>
<style>
-
body {
+
 
-
    background: #ADD8E6 url("https://static.igem.org/mediawiki/2013/d/d7/Im04.gif") left no-repeat fixed;
+
-
    font-family: "Lucida Grande","Lucida Sans Unicode",Arial,Verdana,sans-serif;
+
-
    text-align: center;
+
-
}
+
/* Removing wiki-like stuff */
/* Removing wiki-like stuff */
Line 35: Line 31:
     right: auto;
     right: auto;
     text-align: right;
     text-align: right;
-
     width: 977px;
+
     width: 976px;
     z-index: 7;
     z-index: 7;
}
}
Line 46: Line 42:
/* Layout */
/* Layout */
/**********/
/**********/
-
#heading, #innercontent {
+
body {
-
    /*background: url("https://static.igem.org/mediawiki/2011/b/ba/DTU-Denmark2011-bg2.jpg") repeat #D7D7D7;}*/
+
background-color: background: #ADD8E6 url("https://static.igem.org/mediawiki/2013/d/d7/Im04.gif") left no-repeat fixed;
-
    background: gray;
+
color:#000000;
 +
font-family: Verdana, Arial, Helvetica, sans-serif;
 +
font-size: 12px;
 +
margin: 30px 30px;
 +
padding: 0px;
}
}
-
/*#content, #globalWrapper {
+
.clear{clear:both;}
-
    border: none;
+
* {
-
    width: 75%;
+
margin: 0px;
-
    margin: 0;
+
padding: 0px;
-
    padding: 0;
+
-
}*/
+
-
#globalWrapper {
+
-
    margin: 0 auto;
+
-
    width: 975px;
+
}
}
-
#content {
+
#container {
-
    background-color: white;
+
margin: 0px auto;
-
    border: 1px solid black;
+
text-align: left;
-
    margin-bottom: 10px;
+
width: 717px;
-
    padding: 0 0 20px;
+
-
    width: 975px;
+
}
}
-
 
+
a{
-
#contentSub {
+
font-size:12px;
-
    margin: 0;
+
}
}
-
#search-controls {
+
p{
-
    background: none repeat scroll 0 0 transparent;
+
margin: 15px 0px;
-
    border: 0 none;
+
-
    display: block;
+
-
    height: auto;
+
-
    margin: 0;
+
-
    overflow: visible;
+
-
    position: fixed;
+
-
    right: auto;
+
-
    text-align: right;
+
-
    top: 24px;
+
-
    width: 975px;
+
}
}
-
#searchInput {
+
ul { margin:5px 0px; color:#85a157;}
-
    border: 0 none;
+
/********************** Header ***************************/
-
    color: #555555;
+
#header {
-
    font-size: 85%;
+
margin: 0px 0px 0px 0px;
-
    padding-left: 2px;
+
background-image:url(images/header.jpg);
-
    padding-right: 2px;
+
width:717px;
-
    width: 100px;
+
height:288px;
 +
position:relative;
}
}
-
#searchform {
+
#header ul{
-
    margin: 1px;
+
background-color:#85a157;
 +
width:711px;
 +
border: 3px solid #FFFFFF;
 +
display:block;
 +
top:255px;
 +
position:absolute;
 +
margin: 0px 0px 0px 0px;
 +
height:22px;
 +
padding:5px 0px 0px 0px;
 +
text-align:center;
}
}
-
 
+
#header li{
-
#footer-box {
+
display:inline;
-
    background-color: #D8D5D0;
+
}
}
-
 
+
#header ul a{
-
input.searchButton {
+
text-decoration:none;
-
    color: #FFFFFF;
+
color:#FFFFFF;
-
    cursor: pointer;
+
margin: 0px 15px;
-
    font-size: 80%;
+
-
    font-weight: normal;
+
-
    margin: 0;
+
-
    padding-left: 2px;
+
-
    padding-right: 2px;
+
}
}
-
 
+
#header ul a:hover{
-
#banner{background:transparent;
+
text-decoration:underline;
-
              height: 50px;}
+
color:#28556b;
-
 
+
-
#header {
+
-
    background: url("https://static.igem.org/mediawiki/2013/2/2d/HeaderDelft.png") right no-repeat ;
+
-
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
+
-
    -webkit-box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* for the Safari browser */
+
-
    height: 150px;
+
-
    width: 100%;
+
-
    border-top: 1px solid #660000;
+
-
    border-bottom: 1px solid #660000;}
+
-
 
+
-
#menu, #menu ul {
+
-
margin: 0;
+
-
padding: 0;
+
-
list-style: none;
+
}
}
-
 
+
#logo_w1,#logo_w2 {
-
#menu {
+
font-size: 24px;
-
width: 960px;
+
font-style:italic;
-
margin: 60px auto;
+
color:#FFFFFF;
-
border: 1px solid #222;
+
position:absolute;
-
background-color: #111;
+
-
background-image: linear-gradient(#444, #111);
+
-
border-radius: 6px;
+
-
box-shadow: 0 1px 1px #777;
+
}
}
-
#menu:before,
+
#logo_w1{
-
#menu:after {
+
    font-size: 30px;
-
content: "";
+
top: 10px;
-
display: table;
+
left:10px;
}
}
-
 
+
#logo_w2{
-
#menu:after {
+
top:25px;
-
clear: both;
+
left:540px;
}
}
-
 
+
#header_text {
-
#menu {
+
top:35px;
-
zoom:1;
+
left:10px;
 +
width:230px;
 +
position:absolute;
}
}
-
#menu li {
+
#header_text p{
-
float: left;
+
font-size: 18px;
-
border-right: 1px solid #222;
+
color:#FFFFFF;
-
box-shadow: 1px 0 0 #444;
+
-
position: relative;
+
}
}
-
 
+
#header_text a{color:#28556b;}
-
#menu a {
+
#header_text a:hover{color:#c77e0c;}
-
float: left;
+
/********************** Content ***************************/
-
padding: 12px 17px;
+
#content {
-
color: #999;
+
background-image:url(images/content_bg.gif);  
-
text-transform: uppercase;
+
width:717px;
-
font: bold 10px Arial, Helvetica;
+
-
text-decoration: none;
+
-
text-shadow: 0 1px 0 #000;
+
}
}
-
 
+
img{
-
#menu li:hover > a {
+
border-width:0px;
-
color: #fafafa;
+
}
 +
h1{
 +
color:#000000;
 +
font-size:14px;
 +
margin: 20px 0px 20px 0px;
}
}
-
*html #menu li a:hover { /* IE6 only */
+
h2{
-
color: #fafafa;
+
color:#85a157;
 +
font-size:14px;
 +
text-align:left;
 +
margin: 10px 0px 10px 0px;
}
}
-
</style>
+
h3{
-
<style>
+
color:#222;
-
#menu ul {
+
font-size:12px;
-
margin: 20px 0 0 0;
+
text-align:left;
-
_margin: 0; /*IE6 only*/
+
font-weight:bold;
-
opacity: 0;
+
-
visibility: hidden;
+
-
position: absolute;
+
-
top: 38px;
+
-
left: 0;
+
-
z-index: 1;  
+
-
background: #444;
+
-
background: linear-gradient(#444, #111);
+
-
box-shadow: 0 -1px 0 rgba(255,255,255,.3);
+
-
border-radius: 3px;
+
-
transition: all .2s ease-in-out; 
+
}
}
-
 
+
.event {
-
#menu li:hover > ul {
+
background-color:#efefef;
-
opacity: 1;
+
border:1px dotted #85a157;
-
visibility: visible;
+
padding:10px;
-
margin: 0;
+
margin:3px;
}
}
-
 
+
div.hour {
-
#menu ul ul {
+
text-align:right;
-
top: 0;
+
font-size:12px;
-
left: 150px;
+
border-bottom:1px solid #85a157;
-
margin: 0 0 0 20px;
+
-
_margin: 0; /*IE6 only*/
+
-
box-shadow: -1px 0 0 rgba(255,255,255,.3);
+
}
}
-
 
+
.path {
-
#menu ul li {
+
text-align:left;  
-
float: none;
+
padding:5px 25px;
-
display: block;
+
font-size:11px;
-
border: 0;
+
border:1px solid #efefef;
-
_line-height: 0; /*IE6 only*/
+
-
box-shadow: 0 1px 0 #111, 0 2px 0 #666;
+
}
}
-
 
+
.path a {color:#85a157; font-size:11px;}
-
#menu ul li:last-child {  
+
.path a:hover {color:#c77e0c; font-size:11px;}
-
box-shadow: none;  
+
#left {
 +
float:left;
 +
width:428px;
 +
margin-left:27px;
 +
padding: 0px 10px 30px 0px;
 +
display:inline;
}
}
-
 
+
#left a{color:#28556b;}
-
#menu ul a {  
+
#left a:hover{color:#c77e0c;}
-
padding: 10px;
+
#photos a{
-
width: 130px;
+
margin-right:14px;
-
_height: 10px; /*IE6 only*/
+
-
display: block;
+
-
white-space: nowrap;
+
-
float: none;
+
-
text-transform: none;
+
}
}
 +
#right {
 +
float:right;
 +
width:210px;
 +
padding: 0px 20px 20px 20px;
 +
margin-top:10px;
 +
border-left: #FFF 2px solid;
-
#menu ul a:hover {
 
-
background-color: #0186ba;
 
-
background-image: linear-gradient(#04acec, #0186ba);
 
}
}
 +
#right a{
 +
color:#c77e0c;
 +
}
 +
#right a:hover{
 +
color:#85a157;
 +
}
 +
/********************** Footer ***************************/
 +
#footerline {
 +
clear:both;
 +
background-image:url(images/footer_bg.gif);
 +
font-size:1px;
 +
height:10px;
 +
}
 +
#footer {
 +
width:717px;
 +
text-align:center;
 +
padding: 20px 0px;
 +
}
 +
</style>
</style>
</html>
</html>

Revision as of 09:54, 19 April 2013