Team:RAMNOTIREN CALGARY/Stylesheets/indexcss.css
From 2014hs.igem.org
Line 275: | Line 275: | ||
} | } | ||
- | /*Beginning of sidebar code. | + | /*Beginning of sidebar code.*/ |
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
- | |||
/*end of sidebar code. Work on setting it left of the page and mking the text body relative and next to the sidebar rather than next to it.*/ | /*end of sidebar code. Work on setting it left of the page and mking the text body relative and next to the sidebar rather than next to it.*/ |
Revision as of 17:54, 19 June 2014
body{
background-color: #d6d6d6;
}
- globalWrapper {
position: relative; font-size: 127%; width: 850px //100%; margin: 0px; padding: 0px; padding-bottom: 0px; padding-left: 0px; padding-right: 30px; /*background-color: #D6D6D6;*/ background-image:url('https://static.igem.org/mediawiki/2014hs/3/3d/Dnabgtrwl.png'); background-repeat: no-repeat; background-attachment: fixed; background-size:100% auto;
}
- main-content {
position: relative; width: 850px; margin: 0 auto; padding: 5px 5px 5px 5px;; background: transparent; color: black;
- border-left: 1px solid #ffffff;
- border-right: 1px solid #ffffff;
- line-height: 1.5em;
}
- topmenubar {
position: relative; white-space: nowrap; top: -8px; left: -50px; width: 967px; z-index: 5; font-family: arial, verdana, "sans-serif"; font-size: 70%; line-height: 2em;
}
.topleft-menu, .topleft-menu a {
color: transparent; left: 0px; text-align: left; text-transform: lowercase; text-decoration: none;
}
.topleft-menu:hover {
color: white; background-color: #bbbbbb;
}
.topright-menu, .right-menu a {
right: 0px; text-align: right; color: white;
}
- topmenubar ul {
color: #555555; list-style: none;
}
- topmenubar li {
display: inline; position: relative; cursor: pointer; padding-left: 0px; padding-right: 0px;
}
.topleft-menu li a {
padding: 0px 6px 0px 0px;
}
.topleft-menu .selected {
- color: #bbbbbb;
}
- .left-menu .selected:hover {
- color: white;
}
.topleft-menu:hover a {
color: white;
}
/*css for slider*/
- slides {
position:relative; left: -50px; height:280px; width: 840px
}
- slides IMG {
position:absolute; opacity:0.0; top:0px; left:0px; z-index:1;
}
- slides .current {
z-index:3; opacity:1.0;
}
- slides .previous {
z-index:2;
}
.progress {
margin-top:-270px; margin-left:20px; position:absolute;
}
.progress li{ border:1px solid rgba(0,0,0,0.9); border-radius:3px; margin-left: 5px; float:left; display:block; position:relative; z-index:10; background-color:rgba(255,255,255,0.4);
line-height:1.0em;
}
.progress li a{
padding-left: 6px; padding-right: 6px; font-size:12px; line-height:1.0em;
}
.progress li a:hover {
text-decoration:none; }
.progress .current { background-color:white; }
/*end of css for slider*/
- menu, #menu ul {
margin: 0; padding: 0px; list-style: none;
}
- menu {
position: relative; top: 0px; left: -50px; width: 968px; margin: 0px auto; border: 1px solid #FFF; /*barely change border color*/ background-color: #853399; background-image: linear-gradient(#853399, #6f2981); /*changes the color of the menu bar itself*/ border-radius: 100px; /*box-shadow: 0 1px 1px #853399;*/
}
- menu:before,
- menu:after {
content: ""; display: table;
}
- menu:after {
clear: both;
}
- menu {
zoom:1;
}
- menu li {
float: left; /*border-right: 1px solid #FFF; changes color of lines separating each category*/ /*box-shadow: 1px 0 0 #FFF; */ position: relative;
}
- menu a {
float: right; padding: 10px 44px; color: #FFF; font: bold 15px Arial, Helvetica; text-decoration: none; text-shadow: 0 1px 0 #000;
}
- menu li:hover > a {
color: #ffc750;
}
- html #menu li a:hover { /* IE6 only */
color: #fafafa;
}
- menu ul {
margin: 20px 0 0 0; _margin: 0; /*IE6 only*/ opacity: 0; visibility: hidden; position: absolute; top: 38px; left: 0; z-index: 1; background: #FFF; background: linear-gradient(#853399, #6f2981); box-shadow: 0 -1px 0 rgba(255,255,255,.3); border-radius: 3px; transition: all .4s ease-in-out;
}
- menu li:hover > ul {
opacity: 1; visibility: visible; margin: 0;
}
- menu ul ul {
top: 0; left: 150px; margin: 0 0 0 20px; _margin: 0; /*IE6 only*/ box-shadow: -1px 0 0 rgba(255,255,255,.3);
}
- menu ul li {
float: none; display: block; border: 0; _line-height: 0; /*IE6 only*/ box-shadow: 0 1px 0 #FFF, 0 1px 0 #FFF;
}
- menu ul li:last-child {
box-shadow: none;
}
- menu ul a {
padding: 10px; width: 130px; _height: 10px; /*IE6 only*/ display: block; white-space: nowrap; float: none; text-transform: none;
}
- menu ul a:hover {
background-color: #0186ba; background-image: linear-gradient(#660066, #660066);
}
- title-area{
float: right; width: 600px;
}
/*Beginning of sidebar code.*/
/*end of sidebar code. Work on setting it left of the page and mking the text body relative and next to the sidebar rather than next to it.*/
- page-wrap{
position: relative;
}
.buttons {
clear: both; position: relative; width: 968px; margin-bottom: 12px;
}
.buttons a, .buttons a div {
width: 320px; height: 155px; float: left; margin-bottom: 12px;
}
.buttons div h2 {
padding: 20px 20px 0px; position: relative; top: -155px;
}
.buttons div p {
padding: 0px 20px; position: relative; top: -155px;
}
- button1 {
margin-right: 0px; background: #ffc750;
}
- button6 {
margin-right: 0px; background: #40b6c4;
} /*
- button1:hover #button6:hover {
background: #94FF7D;
}
- /
- button2 {
margin-right: 0px; background: #ff8541;
}
- button5 {
margin-right: 0px; background: #bd4078;
}
/*
- button2:hover, #button5:hover {
background: #7DD7FF;
}
- /
- button3 {
margin: 0px; background: #595959;
}
- button4{
margin: 0px; background: #9900CC;
}
/*
- button3:hover, #button4:hover {
background: #FFE44F;
}
- /
.scrollup {
width: 40px; height: 40px; position: fixed; bottom: 80px; left: 70px; display: none; text-indent: -9999px; background: url('https://static.igem.org/mediawiki/2014hs/3/3d/Arrows1.png') no-repeat; /*icon_top.png*/ background-color: transparent;
}
- test{
position: fixed; bottom: 50px; right: 50px;
}