Team:TU-Delft/Templates/Style

From 2013.igem.org

(Difference between revisions)
 
(269 intermediate revisions not shown)
Line 19: Line 19:
}
}
#menubar {
#menubar {
-
    font-size: 65%;
+
display: table-cell;
-
    top: -14px;}
+
background: transparent;
-
.left-menu:hover {
+
}
-
    background-color: transparent;}
+
 
-
#menubar li a {
+
#menubar.left-menu {
-
    background-color: transparent;}
+
width: 100%;
-
#menubar:hover {
+
}
-
    color: transparent;}
+
 
-
#menubar li a {
+
#menubar.right-menu {
-
    color: grey;}
+
text-align: right;
-
#menubar:hover li a {
+
}
-
    color: grey;}
+
 
 +
#menubar * {
 +
color: transparent !important;
 +
background: transparent !important;
 +
}
 +
 
 +
#top-section:hover #menubar * {
 +
color: grey !important;
 +
}
 +
 
 +
#top-section:hover #menubar.left-menu {
 +
background: rgba(255, 255, 255, 0.75) !important;
 +
}
 +
 
html {
html {
Line 47: Line 60:
width:100%;
width:100%;
height:100%;
height:100%;
-
background:white;
+
background:url("https://static.igem.org/mediawiki/2013/3/32/BackroundDelft.jpg");
 +
        background-repeat:no-repeat;
 +
        background-size: 100% 100%;
 +
        background-size: auto, cover;
 +
        background-position:absolute;
  border:none;
  border:none;
padding-top:20px;
padding-top:20px;
Line 58: Line 75:
}
}
#contentbox {
#contentbox {
-
width: 80%;
+
width: 85%;
position: relative;  
position: relative;  
background:white;
background:white;
-
width:800px;
+
width:850px;
margin: -10px auto 0 auto;
margin: -10px auto 0 auto;
padding:20px 50px 50px 25px;
padding:20px 50px 50px 25px;
Line 111: Line 128:
}
}
-
 
+
#logo {
 +
position:absolute;
 +
top:20px; left:-150px;
 +
}
/* HERE CHANGE THE HEADER */
/* HERE CHANGE THE HEADER */
#header{
#header{
-
         background: url("https://static.igem.org/mediawiki/2013/a/a5/Horizontal_final.png")top no-repeat;    
+
         background:url("https://static.igem.org/mediawiki/2013/9/97/Horizontal-banner-2.jpg");
 +
background-repeat:no-repeat;
 +
background-position: left bottom;
 +
 
background-size: 100% 100%;
background-size: 100% 100%;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
Line 140: Line 163:
     top:800px; right:-187px;
     top:800px; right:-187px;
}
}
-
 
Line 152: Line 174:
#menu {
#menu {
width: 100%;
width: 100%;
-
margin: 60px auto;
+
      padding-top:6px;
 +
      padding-bottom:6px;
border: 1px solid #222;
border: 1px solid #222;
background-color: #111;
background-color: #111;
Line 159: Line 182:
box-shadow: 0 1px 1px #777;
box-shadow: 0 1px 1px #777;
margin-top: 0px;
margin-top: 0px;
-
margin-right:20px;
+
margin-right:0px;
}
}
#menu:before,
#menu:before,
Line 183: Line 206:
#menu a {
#menu a {
-
      position:fixed;
+
 
-
      right: 15%;
+
padding-top:10px;
-
      left:30%;
+
padding-bottom:10px;
-
      top:10px;
+
padding-right:12px;
-
      bottom:10px;
+
padding-left:12px;
-
      width:100%;
+
width:100%;
-
float: left;
+
/*float: left;*/
-
width: 100%;
+
width: 100px;
 +
 
color: #999;
color: #999;
text-transform: uppercase;
text-transform: uppercase;
-
font: bold 12px Arial, Helvetica;
+
font: bold 11px Arial, Helvetica;
text-decoration: none;
text-decoration: none;
text-shadow: 0 1px 0 #000;
text-shadow: 0 1px 0 #000;
-
margin:0 auto;
 
}
}
#menu li:hover > a {
#menu li:hover > a {
 +
background-color: #0186ba;
 +
background-image: linear-gradient(#04acec, #0186ba);
color: #fafafa;
color: #fafafa;
 +
}
}
 +
 +
 +
*html #menu li a:hover { /* IE6 only */
*html #menu li a:hover { /* IE6 only */
 +
color: #fafafa;
color: #fafafa;
}
}
-
 
+
</style>
 +
<style>
#menu ul {
#menu ul {
-
       
 
margin: 20px 0 0 0;
margin: 20px 0 0 0;
_margin: 0; /*IE6 only*/
_margin: 0; /*IE6 only*/
Line 214: Line 244:
visibility: hidden;
visibility: hidden;
position: absolute;
position: absolute;
-
top: 38px;
+
top: 28px;
left: 0;
left: 0;
z-index: 1;     
z-index: 1;     
Line 220: Line 250:
background: linear-gradient(#444, #111);
background: linear-gradient(#444, #111);
box-shadow: 0 -1px 0 rgba(255,255,255,.3);
box-shadow: 0 -1px 0 rgba(255,255,255,.3);
-
border-radius: 3px;
+
border-radius: 4px;
-
transition: all .2s ease-in-out;   
+
      transition: all .10s ease-in-out;   
 +
 
}
}
 +
#menu li:hover > ul {
#menu li:hover > ul {
Line 253: Line 285:
   
   
padding: 10px;
padding: 10px;
-
width: 130px;
+
width: 180px;
_height: 10px; /*IE6 only*/
_height: 10px; /*IE6 only*/
display: block;
display: block;
Line 264: Line 296:
background-color: #0186ba;
background-color: #0186ba;
background-image: linear-gradient(#04acec, #0186ba);
background-image: linear-gradient(#04acec, #0186ba);
 +
}
}
Line 280: Line 313:
     top: 0px;
     top: 0px;
     right: 0px;
     right: 0px;
 +
}
 +
 +
#box {
 +
border: 1px solid #888;
 +
padding: 0px;
 +
margin-bottom: 10px;
 +
        margin-left:40px;
 +
        margin-right:40px;
 +
        margin: 0 auto; 
 +
-moz-border-radius: 10px;
 +
border-radius: 10px;
 +
-moz-box-shadow: 0 0 8px #888;
 +
-webkit-box-shadow: 0 0 8px #888;
 +
box-shadow: 0 0 8px #888;
 +
        width:50%;
}
}

Latest revision as of 08:44, 2 October 2013