Template:Team:DukeHomePage/CSS
From 2014.igem.org
(Difference between revisions)
(288 intermediate revisions not shown) | |||
Line 2: | Line 2: | ||
<head> | <head> | ||
- | <meta http-equiv="Content-Type" content="text/html; charset= | + | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> |
+ | <html xmlns="http://www.w3.org/1999/xhtml"> | ||
+ | <head> | ||
+ | <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> | ||
<style media="screen" type="text/css"> | <style media="screen" type="text/css"> | ||
- | /*hide default igem banner and reformat style into blank slate - UVA | + | /*hide default igem banner and reformat style into blank slate - modified from UVA 2013*/ |
- | #globalWrapper {width: 100%;} | + | |
- | #top-section {width: 100%; height:0px; border:none;} | + | #globalWrapper { |
- | #p-logo {display:none; visibility:hidden;} | + | width: 100%; |
- | #search-controls {display:none;} | + | } |
- | #menubar a {color:# | + | |
- | #menubar a:hover{text-decoration:none; | + | #top-section { |
- | + | width: 100%; | |
- | .left-menu ul {background-color:# | + | height:0px; |
- | .right-menu ul li a {background-color:# | + | border:none; |
- | .printfooter {display:none;} | + | } |
- | #footer-box { | + | |
- | #catlinks {display:none;} | + | #p-logo { |
- | .firstHeading {display:none;} | + | display:none; |
- | #content {width: 100%; border:none; | + | visibility:hidden; |
- | + | } | |
+ | |||
+ | #search-controls { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #menubar a { | ||
+ | color:#000000; | ||
+ | } | ||
+ | |||
+ | #menubar a:hover{ | ||
+ | text-decoration:none; | ||
+ | color:#fff; | ||
+ | } | ||
+ | |||
+ | |||
+ | .left-menu ul { | ||
+ | background-color:#000000; | ||
+ | margin:0; | ||
+ | padding:0; | ||
+ | } | ||
+ | |||
+ | .right-menu ul li a { | ||
+ | background-color:#000; | ||
+ | } | ||
+ | |||
+ | .printfooter { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #footer-box { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #catlinks { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | .firstHeading { | ||
+ | display:none; | ||
+ | } | ||
+ | |||
+ | #content { | ||
+ | width: 100%; | ||
+ | border:none; | ||
+ | background-color:#000; | ||
+ | } | ||
</style> | </style> | ||
+ | <!--BEGIN HERE: This comment marks where actual coding on the main part of the page begins.--> | ||
+ | <style media="screen" type="text/css"> | ||
+ | /*This "bodyContent" style rule controls what the formatting of the page looks like, not body, for some reason. MediaWiki logic, amirite?*/ | ||
+ | #bodyContent { | ||
+ | border:none; | ||
+ | background-color:#000; | ||
+ | font-color:#fff; | ||
+ | font-size: 1em; | ||
+ | font-family: Futura, Helvetica; | ||
+ | } | ||
+ | #bodyContent a { | ||
+ | text-decoration:none; | ||
+ | color:#fff; | ||
+ | } | ||
- | |||
- | |||
+ | /*This formats the stuff at the bottom. */ | ||
+ | body { | ||
+ | background-color:#000; | ||
+ | } | ||
+ | /* Title font */ | ||
+ | .big { | ||
+ | font-size: 4em; | ||
+ | color:#fff; | ||
+ | text-transform:uppercase; | ||
+ | text-align:center; | ||
+ | float:center; | ||
+ | padding-bottom:0px; | ||
+ | } | ||
+ | /* Makes the square buttons */ | ||
+ | .sq-button { | ||
+ | display:block; | ||
+ | width:100px; | ||
+ | height:100px; | ||
+ | border:none; | ||
+ | line-height:50px; | ||
+ | color:#f5f5f5; | ||
+ | text-align:center; | ||
+ | text-decoration:none; | ||
+ | opacity: 1; | ||
+ | background: #0736A4; | ||
+ | font-size:16px; | ||
+ | font-weight:bold; | ||
+ | overflow:hidden; | ||
+ | -webkit-transition: all 0.5s ease; | ||
+ | -moz-transition: all 0.5s ease; | ||
+ | -o-transition: all 0.5s ease; | ||
+ | /*margins must be half of the change in size*/ | ||
+ | margin: 5px 5px; | ||
+ | line-height:200%; | ||
+ | } | ||
+ | |||
+ | .sq-button span { | ||
+ | display: table-cell; | ||
+ | text-align: center; | ||
+ | vertical-align: middle; | ||
+ | } | ||
+ | |||
+ | .sq-button:hover { | ||
+ | background-color: #0000ff; | ||
+ | opacity: 1; | ||
+ | width: 110px; | ||
+ | height: 110px; | ||
+ | /*margins must be negative half of the change in size*/ | ||
+ | margin: -5px -5px; | ||
+ | /* Glow effect */ | ||
+ | -webkit-box-shadow: 0px 0px 20px rgba(7, 54, 164, 0); | ||
+ | -moz-box-shadow: 0px 0px 20px rgba(7, 54, 164, 0; | ||
+ | box-shadow: 0px 0px 20px rgba(7, 54, 164, 0); | ||
+ | } | ||
+ | |||
+ | /* So the logo is out of the way */ | ||
+ | .logo { | ||
+ | z-index:200; | ||
+ | padding:20px; | ||
+ | margin: 0px 100px 0px 0px; | ||
+ | } | ||
+ | |||
+ | .main { | ||
+ | position:relative; | ||
+ | z-index:100; | ||
+ | padding:20px; | ||
+ | text-align:center; | ||
+ | } | ||
+ | |||
+ | img.mainpic { | ||
+ | display:block; | ||
+ | text-align:center; | ||
+ | float:center; | ||
+ | padding-bottom: 10px; | ||
+ | } | ||
+ | |||
+ | </style> | ||
+ | |||
+ | |||
+ | |||
+ | |||
+ | |||
+ | </head> | ||
+ | <body> | ||
+ | <div class="main"> | ||
+ | <p class="big"> | ||
+ | Demonstrating Ultrasensitivity | ||
+ | </p> | ||
+ | <center><a href="https://2014.igem.org"><img class="mainpic" src="https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png" width="400px" height="400px" /></a></center> | ||
+ | <!--https://2014.igem.org/File:Mattigemlogowhite.png or https://static.igem.org/mediawiki/2014/1/1a/Mattigemlogowhite.png --> | ||
+ | </div> | ||
</body> | </body> | ||
</html> | </html> | ||
- | |||
- |
Latest revision as of 14:23, 28 August 2014