Difference between revisions of "Team:British Columbia/Test/Custom CSS"
(43 intermediate revisions by 3 users not shown) | |||
Line 41: | Line 41: | ||
h1 { | h1 { | ||
text-align: center; | text-align: center; | ||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
− | |||
} | } | ||
Line 137: | Line 63: | ||
.bod{ | .bod{ | ||
− | + | ||
width:100%; | width:100%; | ||
height:100%; | height:100%; | ||
Line 175: | Line 101: | ||
#cornerleft{ | #cornerleft{ | ||
− | background: url('https://static.igem.org/mediawiki/2015/ | + | background: url('https://static.igem.org/mediawiki/2015/a/ad/Corner_actual_left_goods.png') no-repeat; |
float:Left; | float:Left; | ||
width:400px; | width:400px; | ||
Line 183: | Line 109: | ||
#cornerright{ | #cornerright{ | ||
− | background: url('https://static.igem.org/mediawiki/2015/ | + | background: url('https://static.igem.org/mediawiki/2015/4/44/Corner_left_good2.png') no-repeat; |
float:right; | float:right; | ||
width:400px; | width:400px; | ||
Line 194: | Line 120: | ||
width:100%; | width:100%; | ||
min-width:1200px; | min-width:1200px; | ||
− | height: | + | height: 70px; |
background-color:#bbd0bf; | background-color:#bbd0bf; | ||
− | border:# | + | border:#738d83 10px solid; |
border-right: none; | border-right: none; | ||
border-left:none; | border-left:none; | ||
Line 218: | Line 144: | ||
background-image:url('https://static.igem.org/mediawiki/2015/c/c1/UBC_logo.png'); | background-image:url('https://static.igem.org/mediawiki/2015/c/c1/UBC_logo.png'); | ||
margin-left:50px; | margin-left:50px; | ||
− | margin-top:- | + | margin-top:-45px; |
} | } | ||
Line 230: | Line 156: | ||
display:block; | display:block; | ||
font-family: "Times New Roman", serif; | font-family: "Times New Roman", serif; | ||
+ | } | ||
+ | |||
+ | #UBCmenu a h4:hover{ | ||
+ | color:#804315; | ||
+ | } | ||
+ | |||
+ | #UBCmenu ul li a:hover{ | ||
+ | color:#804315; | ||
} | } | ||
#UBCmenu h4{ | #UBCmenu h4{ | ||
text-align: center; | text-align: center; | ||
− | padding-top: | + | padding-top:40px; |
padding-left:5px; | padding-left:5px; | ||
margin:0; | margin:0; | ||
Line 257: | Line 191: | ||
#UBCmenu #proj:hover ul{ | #UBCmenu #proj:hover ul{ | ||
+ | display:block; | ||
+ | position:absolute; | ||
+ | } | ||
+ | |||
+ | #UBCmenu #parts:hover ul{ | ||
display:block; | display:block; | ||
position:absolute; | position:absolute; | ||
Line 267: | Line 206: | ||
#UBCmenu #hp:hover ul{ | #UBCmenu #hp:hover ul{ | ||
+ | display:block; | ||
+ | position:absolute; | ||
+ | } | ||
+ | |||
+ | #UBCmenu #ach:hover ul{ | ||
display:block; | display:block; | ||
position:absolute; | position:absolute; | ||
Line 282: | Line 226: | ||
#UBCmenu ul{ | #UBCmenu ul{ | ||
− | margin-top: | + | margin-top:30px; |
− | margin-left: | + | margin-left:27px; |
z-index:100; | z-index:100; | ||
} | } | ||
#UBCmenu ul li{ | #UBCmenu ul li{ | ||
− | width: | + | width:60px; |
background-color:#e7b76d; | background-color:#e7b76d; | ||
margin:0; | margin:0; | ||
Line 296: | Line 240: | ||
opacity:0.99; | opacity:0.99; | ||
line-height:100%; | line-height:100%; | ||
+ | } | ||
+ | |||
+ | #UBCmenu ul li ul{ | ||
+ | width:60px; | ||
+ | background-color:#e7b76d; | ||
+ | margin:0; | ||
+ | padding:5px; | ||
+ | text-align:center; | ||
+ | border-bottom:solid 1px #e1d1b4; | ||
+ | opacity:0.99; | ||
+ | line-height:100%; | ||
+ | float:left; | ||
+ | margin-left:60px; | ||
+ | margin-top:-40px; | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | ul li:hover ul{ | ||
+ | display:block; | ||
+ | } | ||
+ | |||
+ | #UBCmenu ul li ul li{ | ||
+ | float:left; | ||
} | } | ||
Line 303: | Line 270: | ||
#UBCmenu #proj{ | #UBCmenu #proj{ | ||
− | width: | + | width:114px; |
− | height: | + | height: 100px; |
float:left; | float:left; | ||
position: relative; | position: relative; | ||
− | background-image:url('https://static.igem.org/mediawiki/2015/ | + | background-image:url('https://static.igem.org/mediawiki/2015/8/8f/UBC_buttonartefact.png'); |
background-repeat:no-repeat; | background-repeat:no-repeat; | ||
background-position:center; | background-position:center; | ||
Line 313: | Line 280: | ||
} | } | ||
− | #UBCmenu # | + | |
− | width: | + | #UBCmenu #parts{ |
− | height: | + | width:114px; |
+ | height: 100px; | ||
float:left; | float:left; | ||
position: relative; | position: relative; | ||
− | background-image:url('https://static.igem.org/mediawiki/2015/ | + | background-image:url('https://static.igem.org/mediawiki/2015/8/8f/UBC_buttonartefact.png'); |
background-repeat:no-repeat; | background-repeat:no-repeat; | ||
background-position:center; | background-position:center; | ||
− | margin-left:- | + | margin-left:-30px; |
margin-top:-40px; | margin-top:-40px; | ||
} | } | ||
− | #UBCmenu # | + | #UBCmenu #model{ |
− | width: | + | width:114px; |
− | height: | + | height: 100px; |
float:left; | float:left; | ||
position: relative; | position: relative; | ||
− | background-image:url('https://static.igem.org/mediawiki/2015/ | + | background-image:url('https://static.igem.org/mediawiki/2015/8/8f/UBC_buttonartefact.png'); |
background-repeat:no-repeat; | background-repeat:no-repeat; | ||
background-position:center; | background-position:center; | ||
margin-top: 30px; | margin-top: 30px; | ||
− | margin-left:- | + | margin-left:-30px; |
} | } | ||
#UBCmenu #hp h4{ | #UBCmenu #hp h4{ | ||
line-height:15px; | line-height:15px; | ||
− | padding-top: | + | padding-top:33px;} |
− | #UBCmenu # | + | #UBCmenu #hp{ |
− | width: | + | width:114px; |
− | height: | + | height: 100px; |
float:left; | float:left; | ||
position: relative; | position: relative; | ||
− | background-image:url('https://static.igem.org/mediawiki/2015/ | + | background-image:url('https://static.igem.org/mediawiki/2015/8/8f/UBC_buttonartefact.png'); |
background-repeat:no-repeat; | background-repeat:no-repeat; | ||
background-position:center; | background-position:center; | ||
− | margin-left:- | + | margin-left:-30px; |
margin-top:-40px; | margin-top:-40px; | ||
} | } | ||
Line 353: | Line 321: | ||
#UBCmenu #hp ul{ | #UBCmenu #hp ul{ | ||
margin-top:40px; | margin-top:40px; | ||
+ | } | ||
+ | |||
+ | #UBCmenu #team{ | ||
+ | width:114px; | ||
+ | height: 100px; | ||
+ | float:left; | ||
+ | position: relative; | ||
+ | background-image:url('https://static.igem.org/mediawiki/2015/8/8f/UBC_buttonartefact.png'); | ||
+ | background-repeat:no-repeat; | ||
+ | background-position:center; | ||
+ | margin-top: 30px; | ||
+ | margin-left:-30px; | ||
} | } | ||
#UBCmenu #note{ | #UBCmenu #note{ | ||
− | width: | + | width:114px; |
− | height: | + | height: 100px; |
+ | float:left; | ||
+ | position: relative; | ||
+ | background-image:url('https://static.igem.org/mediawiki/2015/8/8f/UBC_buttonartefact.png'); | ||
+ | background-repeat:no-repeat; | ||
+ | background-position:center; | ||
+ | margin-left:-30px; | ||
+ | margin-top:-40px; | ||
+ | } | ||
+ | |||
+ | #UBCmenu #ach{ | ||
+ | width:114px; | ||
+ | height: 100px; | ||
float:left; | float:left; | ||
position: relative; | position: relative; | ||
− | background-image:url('https://static.igem.org/mediawiki/2015/ | + | background-image:url('https://static.igem.org/mediawiki/2015/8/8f/UBC_buttonartefact.png'); |
background-repeat:no-repeat; | background-repeat:no-repeat; | ||
background-position:center; | background-position:center; | ||
margin-top: 30px; | margin-top: 30px; | ||
− | margin-left:- | + | margin-left:-30px; |
} | } | ||
Line 372: | Line 364: | ||
margin: 0 auto; | margin: 0 auto; | ||
text-align:center; | text-align:center; | ||
− | padding-top: | + | padding-top:220px; |
} | } | ||
Line 450: | Line 442: | ||
#homepageimg{ | #homepageimg{ | ||
width: 1200px; | width: 1200px; | ||
− | height: | + | height: 1200px; |
margin: 0 auto; | margin: 0 auto; | ||
background-image: url('https://static.igem.org/mediawiki/2015/8/8e/UBChoverme.png'); | background-image: url('https://static.igem.org/mediawiki/2015/8/8e/UBChoverme.png'); | ||
Line 473: | Line 465: | ||
} | } | ||
− | #UBCbody | + | #UBCbody { |
text-indent:20px; | text-indent:20px; | ||
− | |||
− | |||
} | } | ||
Line 490: | Line 480: | ||
float:right; | float:right; | ||
padding-right:50px; | padding-right:50px; | ||
+ | } | ||
+ | |||
+ | .CSSTableGenerator { | ||
+ | margin:0px;padding:0px; | ||
+ | width:100%; | ||
+ | box-shadow: 10px 10px 5px #888888; | ||
+ | border:1px solid #000000; | ||
+ | |||
+ | -moz-border-radius-bottomleft:0px; | ||
+ | -webkit-border-bottom-left-radius:0px; | ||
+ | border-bottom-left-radius:0px; | ||
+ | |||
+ | -moz-border-radius-bottomright:0px; | ||
+ | -webkit-border-bottom-right-radius:0px; | ||
+ | border-bottom-right-radius:0px; | ||
+ | |||
+ | -moz-border-radius-topright:0px; | ||
+ | -webkit-border-top-right-radius:0px; | ||
+ | border-top-right-radius:0px; | ||
+ | |||
+ | -moz-border-radius-topleft:0px; | ||
+ | -webkit-border-top-left-radius:0px; | ||
+ | border-top-left-radius:0px; | ||
+ | }.CSSTableGenerator table{ | ||
+ | border-collapse: collapse; | ||
+ | border-spacing: 0; | ||
+ | width:100%; | ||
+ | height:100%; | ||
+ | margin:0px;padding:0px; | ||
+ | }.CSSTableGenerator tr:last-child td:last-child { | ||
+ | -moz-border-radius-bottomright:0px; | ||
+ | -webkit-border-bottom-right-radius:0px; | ||
+ | border-bottom-right-radius:0px; | ||
+ | } | ||
+ | .CSSTableGenerator table tr:first-child td:first-child { | ||
+ | -moz-border-radius-topleft:0px; | ||
+ | -webkit-border-top-left-radius:0px; | ||
+ | border-top-left-radius:0px; | ||
+ | } | ||
+ | .CSSTableGenerator table tr:first-child td:last-child { | ||
+ | -moz-border-radius-topright:0px; | ||
+ | -webkit-border-top-right-radius:0px; | ||
+ | border-top-right-radius:0px; | ||
+ | }.CSSTableGenerator tr:last-child td:first-child{ | ||
+ | -moz-border-radius-bottomleft:0px; | ||
+ | -webkit-border-bottom-left-radius:0px; | ||
+ | border-bottom-left-radius:0px; | ||
+ | }.CSSTableGenerator tr:hover td{ | ||
+ | |||
+ | } | ||
+ | .CSSTableGenerator tr:nth-child(odd){ background-color:#ffaa56; } | ||
+ | .CSSTableGenerator tr:nth-child(even) { background-color:#ffffff; }.CSSTableGenerator td{ | ||
+ | vertical-align:middle; | ||
+ | |||
+ | |||
+ | border:1px solid #000000; | ||
+ | border-width:0px 1px 1px 0px; | ||
+ | text-align:center; | ||
+ | padding:7px; | ||
+ | font-size:10px; | ||
+ | font-family:Helvetica; | ||
+ | font-weight:bold; | ||
+ | color:#000000; | ||
+ | }.CSSTableGenerator tr:last-child td{ | ||
+ | border-width:0px 1px 0px 0px; | ||
+ | }.CSSTableGenerator tr td:last-child{ | ||
+ | border-width:0px 0px 1px 0px; | ||
+ | }.CSSTableGenerator tr:last-child td:last-child{ | ||
+ | border-width:0px 0px 0px 0px; | ||
+ | } | ||
+ | .CSSTableGenerator tr:first-child td{ | ||
+ | background:-o-linear-gradient(bottom, #ff7f00 5%, #bf5f00 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff7f00), color-stop(1, #bf5f00) ); | ||
+ | background:-moz-linear-gradient( center top, #ff7f00 5%, #bf5f00 100% ); | ||
+ | filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7f00", endColorstr="#bf5f00"); background: -o-linear-gradient(top,#ff7f00,bf5f00); | ||
+ | |||
+ | background-color:#ff7f00; | ||
+ | border:0px solid #000000; | ||
+ | text-align:center; | ||
+ | border-width:0px 0px 1px 1px; | ||
+ | font-size:18px; | ||
+ | font-family:Helvetica; | ||
+ | font-weight:bold; | ||
+ | color:#ffffff; | ||
+ | } | ||
+ | .CSSTableGenerator tr:first-child:hover td{ | ||
+ | background:-o-linear-gradient(bottom, #ff7f00 5%, #bf5f00 100%); background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ff7f00), color-stop(1, #bf5f00) ); | ||
+ | background:-moz-linear-gradient( center top, #ff7f00 5%, #bf5f00 100% ); | ||
+ | filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff7f00", endColorstr="#bf5f00"); background: -o-linear-gradient(top,#ff7f00,bf5f00); | ||
+ | |||
+ | background-color:#ff7f00; | ||
+ | } | ||
+ | .CSSTableGenerator tr:first-child td:first-child{ | ||
+ | border-width:0px 0px 1px 0px; | ||
+ | } | ||
+ | .CSSTableGenerator tr:first-child td:last-child{ | ||
+ | border-width:0px 0px 1px 1px; | ||
} | } | ||
Latest revision as of 23:10, 17 October 2015