"
User:L7ukas/lymain.css
From 2010.igem.org
< User:L7ukas(Difference between revisions)
(New page: ul.ly { list-style-type:none; margin-left:220px; padding:0px; overflow:hidden; } li.ly { float:left; } a.ly:link, a.ly:visited { display:block; width:175px; font-weight:bold; color:#808080...) |
|||
| Line 1: | Line 1: | ||
| + | ul.navigation | ||
| + | { | ||
| + | position:absolute; | ||
| + | z-index:1; | ||
| + | top:184px; | ||
| + | left:158px; | ||
| + | } | ||
| + | #trans-nav | ||
| + | { | ||
| + | list-style-type:none; | ||
| + | height:40px; | ||
| + | padding:0; | ||
| + | margin:0; | ||
| + | } | ||
| + | #trans-nav li | ||
| + | { | ||
| + | float:left; | ||
| + | position:relative; | ||
| + | z-index:1; | ||
| + | padding:0; | ||
| + | line-height:40px; | ||
| + | background:#5a8078 url(nav-bg.png) repeat-x 0 0; | ||
| + | } | ||
| + | #trans-nav li:hover | ||
| + | { | ||
| + | opacity:0.8; | ||
| + | background-position:0 -40px; | ||
| + | } | ||
| + | #trans-nav li a | ||
| + | { | ||
| + | display:block; | ||
| + | width:130px; | ||
| + | font-weight:bold; | ||
| + | color:#FFFFFF; | ||
| + | background-color:#000066; | ||
| + | text-align:center; | ||
| + | padding:4px; | ||
| + | padding-bottom:8px; | ||
| + | padding-top:8px; | ||
| + | text-decoration:none; | ||
| + | text-transform:uppercase; | ||
| + | display:block; | ||
| + | padding:0 15px; | ||
| + | color:#fff; | ||
| + | text-decoration:none; | ||
| + | } | ||
| + | #trans-nav li a:hover | ||
| + | { | ||
| + | color:#FFFFFF; | ||
| + | background-color:#C8C8C8; | ||
| + | } | ||
| + | #trans-nav li ul | ||
| + | { | ||
| + | opacity:0; | ||
| + | position:absolute; | ||
| + | z-index:1; | ||
| + | left:0; | ||
| + | width:8em; | ||
| + | background:#C8C8C8; | ||
| + | list-style-type:none; | ||
| + | padding:0; | ||
| + | margin:0; | ||
| + | } | ||
| + | #trans-nav li:hover ul | ||
| + | { | ||
| + | opacity:1; | ||
| + | } | ||
| + | #trans-nav li ul link | ||
| + | { | ||
| + | float:none; | ||
| + | position:static; | ||
| + | height:0; | ||
| + | line-height:0; | ||
| + | background:none; | ||
| + | } | ||
| + | #trans-nav li:hover ul link | ||
| + | { | ||
| + | height:30px; | ||
| + | line-height:30px; | ||
| + | } | ||
| + | #trans-nav li ul li area | ||
| + | { | ||
| + | background:#C8C8C8; | ||
| + | } | ||
| + | #trans-nav li ul li a:hover | ||
| + | { | ||
| + | background:#C8C8C8; | ||
| + | } | ||
| + | #trans-nav li { -webkit-transition: all 0.2s; } | ||
| + | #trans-nav li a { -webkit-transition: all 0.5s; } | ||
| + | #trans-nav li ul { -webkit-transition: all 1s; } | ||
| + | #trans-nav li ul li { -webkit-transition: height 0.5s; } | ||
| + | |||
ul.ly | ul.ly | ||
{ | { | ||
list-style-type:none; | list-style-type:none; | ||
| - | margin- | + | margin:0px; |
| + | padding:0px; | ||
| + | overflow:hidden; | ||
| + | } | ||
| + | ul.li | ||
| + | { | ||
| + | list-style-type:none; | ||
| + | margin:0px; | ||
padding:0px; | padding:0px; | ||
overflow:hidden; | overflow:hidden; | ||
| Line 10: | Line 110: | ||
float:left; | float:left; | ||
} | } | ||
| - | a.ly:link, | + | a.ly:link,a.ly:visited |
| - | a.ly:visited | + | |
{ | { | ||
display:block; | display:block; | ||
| - | width: | + | width:192px; |
font-weight:bold; | font-weight:bold; | ||
| - | color:# | + | color:#FFFFFF; |
| - | background-color:# | + | background-color:#000066; |
text-align:center; | text-align:center; | ||
padding:4px; | padding:4px; | ||
| + | padding-bottom:8px; | ||
| + | padding-top:8px; | ||
text-decoration:none; | text-decoration:none; | ||
text-transform:uppercase; | text-transform:uppercase; | ||
} | } | ||
| - | a.ly:hover, | + | a.ly:hover,a.ly:active |
| - | a.ly:active | + | |
{ | { | ||
color:#FFFFFF; | color:#FFFFFF; | ||
background-color:#C8C8C8; | background-color:#C8C8C8; | ||
} | } | ||
| - | a.ry:link, | + | a.ry:link,a.ry:visited |
| - | a.ry:visited | + | |
{ | { | ||
display:block; | display:block; | ||
| - | width: | + | width:192px; |
font-weight:bold; | font-weight:bold; | ||
text-align:center; | text-align:center; | ||
padding:4px; | padding:4px; | ||
| + | padding-bottom:8px; | ||
| + | padding-top:8px; | ||
text-decoration:none; | text-decoration:none; | ||
text-transform:uppercase; | text-transform:uppercase; | ||
| Line 43: | Line 144: | ||
} | } | ||
| + | li.li | ||
| + | { | ||
| + | float:left; | ||
| + | } | ||
| + | a.li:link,a.li:visited | ||
| + | { | ||
| + | display:block; | ||
| + | width:140px; | ||
| + | font-weight:bold; | ||
| + | color:#FFFFFF; | ||
| + | background-color:#000066; | ||
| + | text-align:left; | ||
| + | padding:4px; | ||
| + | padding-bottom:8px; | ||
| + | padding-top:8px; | ||
| + | text-decoration:none; | ||
| + | text-transform:uppercase; | ||
| + | } | ||
| + | a.li:hover,a.li:active | ||
| + | { | ||
| + | color:#FFFFFF; | ||
| + | background-color:#C8C8C8; | ||
| + | } | ||
| + | a.ri:link,a.ri:visited | ||
| + | { | ||
| + | display:block; | ||
| + | width:140px; | ||
| + | font-weight:bold; | ||
| + | text-align:left; | ||
| + | padding:4px; | ||
| + | padding-bottom:8px; | ||
| + | padding-top:8px; | ||
| + | text-decoration:none; | ||
| + | text-transform:uppercase; | ||
| + | color:#FFFFFF; | ||
| + | background-color:#808080; | ||
| + | } | ||
| + | li.lc | ||
| + | { | ||
| + | float:left; | ||
| + | } | ||
| + | a.lc:link,a.lc:visited | ||
| + | { | ||
| + | display:block; | ||
| + | width:142px; | ||
| + | font-weight:bold; | ||
| + | color:#FFFFFF; | ||
| + | background-color:#000066; | ||
| + | text-align:left; | ||
| + | padding:4px; | ||
| + | padding-bottom:8px; | ||
| + | padding-top:8px; | ||
| + | text-decoration:none; | ||
| + | text-transform:uppercase; | ||
| + | } | ||
| + | a.lc:hover,a.lc:active | ||
| + | { | ||
| + | color:#FFFFFF; | ||
| + | background-color:#C8C8C8; | ||
| + | } | ||
| + | a.rc:link,a.rc:visited | ||
| + | { | ||
| + | display:block; | ||
| + | width:142px; | ||
| + | font-weight:bold; | ||
| + | text-align:left; | ||
| + | padding:4px; | ||
| + | padding-bottom:8px; | ||
| + | padding-top:8px; | ||
| + | text-decoration:none; | ||
| + | text-transform:uppercase; | ||
| + | color:#FFFFFF; | ||
| + | background-color:#808080; | ||
| + | } | ||
body | body | ||
{ | { | ||
| - | background-color:# | + | background-color:#FFFFFF; |
| + | } | ||
| + | h1.firstHeading | ||
| + | { | ||
| + | text-decoration:none; | ||
| + | color:#FFFFFF; | ||
| + | font-size:0px; | ||
} | } | ||
h2 | h2 | ||
| Line 53: | Line 234: | ||
color:#808080; | color:#808080; | ||
text-align:left; | text-align:left; | ||
| + | } | ||
| + | p.right | ||
| + | { | ||
| + | top:200px; | ||
| + | background-color:#808080; | ||
| + | float:left | ||
| + | } | ||
| + | p.photo | ||
| + | { | ||
| + | font-family:"Verdana"; | ||
| + | font-size:11px; | ||
| + | } | ||
| + | p.back | ||
| + | { | ||
| + | text-indent: 1em; | ||
| + | font-family:"Verdana"; | ||
| + | font-size:15px; | ||
} | } | ||
p.padding | p.padding | ||
| Line 60: | Line 258: | ||
font-size:12px; | font-size:12px; | ||
} | } | ||
| - | div. | + | div.exphoto |
{ | { | ||
| - | margin-left: | + | position:absolute; |
| - | width: | + | top:225px; |
| + | background:#808080; | ||
| + | color:#FFFFFF; | ||
| + | float:center; | ||
| + | margin-left:150px; | ||
| + | width:570px; | ||
| + | padding:10px; | ||
| + | border:15px solid gray; | ||
| + | border-right:195px solid gray; | ||
| + | border-bottom:0px solid gray; | ||
| + | } | ||
| + | div.exmain | ||
| + | { | ||
| + | position:absolute; | ||
| + | top:754px; | ||
| + | float:center; | ||
| + | margin-left:150px; | ||
| + | width:570px; | ||
padding:20px; | padding:20px; | ||
border:25px solid gray; | border:25px solid gray; | ||
| - | border-right: | + | border-top:0px solid gray; |
| - | border-bottom:150px solid gray; | + | border-right:165px solid gray; |
| + | border-bottom:70px solid gray; | ||
| + | } | ||
| + | div.ly | ||
| + | { | ||
| + | position:absolute; | ||
| + | top:800px; | ||
| + | float:left; | ||
| + | margin-left:0px; | ||
| + | width:150px; | ||
| + | padding:0px; | ||
| + | border:0px solid gray; | ||
| + | border-right:0px solid gray; | ||
| + | border-bottom:0px solid gray; | ||
| + | } | ||
| + | div.ry | ||
| + | { | ||
| + | z-index:1; | ||
| + | position:absolute; | ||
| + | top:225px; | ||
| + | left:800px; | ||
| + | float:right; | ||
| + | margin-left:0px; | ||
| + | width:175px; | ||
| + | padding:0px; | ||
| + | border:0px solid gray; | ||
| + | border-right:0px solid gray; | ||
| + | border-bottom:0px solid gray; | ||
| + | } | ||
Latest revision as of 03:12, 18 July 2010
ul.navigation
{
position:absolute;
z-index:1;
top:184px;
left:158px;
}
#trans-nav
{
list-style-type:none;
height:40px;
padding:0;
margin:0;
}
#trans-nav li
{
float:left;
position:relative;
z-index:1;
padding:0;
line-height:40px;
background:#5a8078 url(nav-bg.png) repeat-x 0 0;
}
#trans-nav li:hover
{
opacity:0.8;
background-position:0 -40px;
}
#trans-nav li a
{
display:block;
width:130px;
font-weight:bold;
color:#FFFFFF;
background-color:#000066;
text-align:center;
padding:4px;
padding-bottom:8px;
padding-top:8px;
text-decoration:none;
text-transform:uppercase;
display:block;
padding:0 15px;
color:#fff;
text-decoration:none;
}
#trans-nav li a:hover
{
color:#FFFFFF;
background-color:#C8C8C8;
}
#trans-nav li ul
{
opacity:0;
position:absolute;
z-index:1;
left:0;
width:8em;
background:#C8C8C8;
list-style-type:none;
padding:0;
margin:0;
}
#trans-nav li:hover ul
{
opacity:1;
}
#trans-nav li ul link
{
float:none;
position:static;
height:0;
line-height:0;
background:none;
}
#trans-nav li:hover ul link
{
height:30px;
line-height:30px;
}
#trans-nav li ul li area
{
background:#C8C8C8;
}
#trans-nav li ul li a:hover
{
background:#C8C8C8;
}
#trans-nav li { -webkit-transition: all 0.2s; }
#trans-nav li a { -webkit-transition: all 0.5s; }
#trans-nav li ul { -webkit-transition: all 1s; }
#trans-nav li ul li { -webkit-transition: height 0.5s; }
ul.ly
{
list-style-type:none;
margin:0px;
padding:0px;
overflow:hidden;
}
ul.li
{
list-style-type:none;
margin:0px;
padding:0px;
overflow:hidden;
}
li.ly
{
float:left;
}
a.ly:link,a.ly:visited
{
display:block;
width:192px;
font-weight:bold;
color:#FFFFFF;
background-color:#000066;
text-align:center;
padding:4px;
padding-bottom:8px;
padding-top:8px;
text-decoration:none;
text-transform:uppercase;
}
a.ly:hover,a.ly:active
{
color:#FFFFFF;
background-color:#C8C8C8;
}
a.ry:link,a.ry:visited
{
display:block;
width:192px;
font-weight:bold;
text-align:center;
padding:4px;
padding-bottom:8px;
padding-top:8px;
text-decoration:none;
text-transform:uppercase;
color:#FFFFFF;
background-color:#808080;
}
li.li
{
float:left;
}
a.li:link,a.li:visited
{
display:block;
width:140px;
font-weight:bold;
color:#FFFFFF;
background-color:#000066;
text-align:left;
padding:4px;
padding-bottom:8px;
padding-top:8px;
text-decoration:none;
text-transform:uppercase;
}
a.li:hover,a.li:active
{
color:#FFFFFF;
background-color:#C8C8C8;
}
a.ri:link,a.ri:visited
{
display:block;
width:140px;
font-weight:bold;
text-align:left;
padding:4px;
padding-bottom:8px;
padding-top:8px;
text-decoration:none;
text-transform:uppercase;
color:#FFFFFF;
background-color:#808080;
}
li.lc
{
float:left;
}
a.lc:link,a.lc:visited
{
display:block;
width:142px;
font-weight:bold;
color:#FFFFFF;
background-color:#000066;
text-align:left;
padding:4px;
padding-bottom:8px;
padding-top:8px;
text-decoration:none;
text-transform:uppercase;
}
a.lc:hover,a.lc:active
{
color:#FFFFFF;
background-color:#C8C8C8;
}
a.rc:link,a.rc:visited
{
display:block;
width:142px;
font-weight:bold;
text-align:left;
padding:4px;
padding-bottom:8px;
padding-top:8px;
text-decoration:none;
text-transform:uppercase;
color:#FFFFFF;
background-color:#808080;
}
body
{
background-color:#FFFFFF;
}
h1.firstHeading
{
text-decoration:none;
color:#FFFFFF;
font-size:0px;
}
h2
{
color:#808080;
text-align:left;
}
p.right
{
top:200px;
background-color:#808080;
float:left
}
p.photo
{
font-family:"Verdana";
font-size:11px;
}
p.back
{
text-indent: 1em;
font-family:"Verdana";
font-size:15px;
}
p.padding
{
text-indent: 1em;
font-family:"Verdana";
font-size:12px;
}
div.exphoto
{
position:absolute;
top:225px;
background:#808080;
color:#FFFFFF;
float:center;
margin-left:150px;
width:570px;
padding:10px;
border:15px solid gray;
border-right:195px solid gray;
border-bottom:0px solid gray;
}
div.exmain
{
position:absolute;
top:754px;
float:center;
margin-left:150px;
width:570px;
padding:20px;
border:25px solid gray;
border-top:0px solid gray;
border-right:165px solid gray;
border-bottom:70px solid gray;
}
div.ly
{
position:absolute;
top:800px;
float:left;
margin-left:0px;
width:150px;
padding:0px;
border:0px solid gray;
border-right:0px solid gray;
border-bottom:0px solid gray;
}
div.ry
{
z-index:1;
position:absolute;
top:225px;
left:800px;
float:right;
margin-left:0px;
width:175px;
padding:0px;
border:0px solid gray;
border-right:0px solid gray;
border-bottom:0px solid gray;
}
