Keithaiken (Talk | contribs) |
Chris.isaac (Talk | contribs) |
||
(55 intermediate revisions by one other user not shown) | |||
Line 2: | Line 2: | ||
<head> | <head> | ||
<!-- Fonts will be selected and then uploaded to the iGEM server when the decision is made --> | <!-- Fonts will be selected and then uploaded to the iGEM server when the decision is made --> | ||
− | + | <link href="https://fonts.googleapis.com/css?family=Permanent+Marker" rel="stylesheet"> | |
− | + | <link href="https://fonts.googleapis.com/css?family=Raleway" rel="stylesheet"> | |
− | + | ||
− | + | ||
− | + | ||
</head> | </head> | ||
<style> | <style> | ||
Line 16: | Line 13: | ||
#gear {z-index: 888; padding-top: 80px; padding-left: 100px;} | #gear {z-index: 888; padding-top: 80px; padding-left: 100px;} | ||
#img-gear {-webkit-animation: rotation 2s infinite linear;} | #img-gear {-webkit-animation: rotation 2s infinite linear;} | ||
− | @-webkit-keyframes rotation { from {-webkit-transform: rotate(0deg);} to {-webkit-transform: rotate(359deg);}} | + | @-webkit-keyframes rotation { |
+ | from { | ||
+ | -webkit-transform: rotate(0deg); | ||
+ | -moz-transform: rotate(0deg); | ||
+ | -o-transform: rotate(0deg); | ||
+ | transform: rotate(0deg);} | ||
+ | to { | ||
+ | -webkit-transform: rotate(359deg); | ||
+ | -moz-transform: rotate(359deg); | ||
+ | -o-transform: rotate(359deg); | ||
+ | transform: rotate(359deg); | ||
+ | }} | ||
/* END LOGO CONTAINER */ | /* END LOGO CONTAINER */ | ||
div#top_title {/*visibility: hidden;*/ display: none;} | div#top_title {/*visibility: hidden;*/ display: none;} | ||
− | body {font-family: 'Ralway', sans-serif | + | body {background-color: white; } |
+ | /*background-image: url(https://static.igem.org/mediawiki/2018/c/c0/T--Lethbridge--backgroundTexture.jpg)*/ | ||
+ | /* Background cardboard texture designed by kues1@Freepik */ | ||
+ | |||
+ | /* Alternative to body section, so we don't get the navbar or other components affected */ | ||
+ | .content {font-family: 'Ralway', sans-serif; color: darkslategrey !important; margin-left: 3% !important; margin-right: 3% !important; opacity: 0.999} | ||
/* HEADERS */ | /* HEADERS */ | ||
− | h1, h2, h3, h4, h5, h6 {color: black !important; font-family: ' | + | h1, h2, h3, h4, h5, h6 {/*color: black !important;*/ font-family: 'Permanent Marker', cursive !important;} |
h1 {text-align: center; font-size: 24pt} | h1 {text-align: center; font-size: 24pt} | ||
− | h2 {text-align: left; font-size: 18pt} | + | h2 {text-align: left; margin-left: 2em;font-size: 18pt} |
− | h3 {text-align: left; font-size: 16pt} | + | h3 {text-align: left; margin-left: 2em font-size: 16pt} |
− | h4 {text-align: left; font-size: 14pt} | + | h4 {text-align: left; margin-left: 2em font-size: 14pt} |
− | h5 {text-align: left; font-size: 12pt} | + | h5 {text-align: left; margin-left: 2em font-size: 12pt} |
h6 {text-align: center; font-size: 10pt} | h6 {text-align: center; font-size: 10pt} | ||
− | /* INLINE BLOCK - | + | /* INLINE BLOCK - DIV % WIDTH, ALIGNMENT */ |
#div60mid {width: 60%; vertical-align:middle;} | #div60mid {width: 60%; vertical-align:middle;} | ||
#div50mid {width: 50%; vertical-align:middle;} | #div50mid {width: 50%; vertical-align:middle;} | ||
Line 54: | Line 67: | ||
#div20top {width: 20%; vertical-align:top;} | #div20top {width: 20%; vertical-align:top;} | ||
− | /* | + | /* FONT SIZE */ |
− | .f10 {font-size: calc(10px + 0.45vw) !important; line-height: calc (1.1em + 0.45vw) !important;} | + | .f10 {font-size: calc(10px + 0.45vw) !important; line-height: calc(1.1em + 0.45vw) !important;} |
+ | .f11 {font-size: calc(11px + 0.45vw) !important; line-height: calc(1.1em + 0.45vw) !important;} | ||
.f12 {font-size: calc(12px + 0.5vw) !important; line-height: calc(1.1em + 0.5vw) !important;} | .f12 {font-size: calc(12px + 0.5vw) !important; line-height: calc(1.1em + 0.5vw) !important;} | ||
− | .f14 {font-size: calc(14px + 0.5vw) !important; line-height: calc(1.1em + 0. | + | .f13 {font-size: calc(13px + 0.5vw) !important; line-height: calc(1.1em + 0.45vw) !important;} |
− | .f16 {font-size: calc(16px + 0.5vw) !important; line-height: calc(1.1em + 0. | + | .f14 {font-size: calc(14px + 0.5vw) !important; line-height: calc(1.1em + 0.55vw) !important;} |
− | .f18 {font-size: calc(18px + 0.5vw) !important; line-height: calc(1.1em + 0. | + | .f16 {font-size: calc(16px + 0.5vw) !important; line-height: calc(1.1em + 0.60vw) !important;} |
− | .f22 {font-size: calc(22px + 0.5vw) !important; line-height: calc(1.1em + 0. | + | .f18 {font-size: calc(18px + 0.5vw) !important; line-height: calc(1.1em + 0.65vw) !important;} |
− | .f26 {font-size: calc(26px + 0.5vw) !important; line-height: calc(1.1em + 0. | + | .f22 {font-size: calc(22px + 0.5vw) !important; line-height: calc(1.1em + 0.70vw) !important;} |
− | .f34 {font-size: calc(34px + 0.5vw) !important; line-height: calc(1.1em + 0. | + | .f26 {font-size: calc(26px + 0.5vw) !important; line-height: calc(1.1em + 0.75vw) !important;} |
+ | .f34 {font-size: calc(34px + 0.5vw) !important; line-height: calc(1.1em + 0.80vw) !important;} | ||
− | /* | + | /* ALIGNMENT, WEIGHT, AND STYLE */ |
#left {text-align: left !important; font-weight: normal;} | #left {text-align: left !important; font-weight: normal;} | ||
#left-bold {text-align: left !important; font-weight: bold;} | #left-bold {text-align: left !important; font-weight: bold;} | ||
Line 89: | Line 104: | ||
#justify-italic-bold {text-align: justify !important; font-weight: bold; font-style: italic;} | #justify-italic-bold {text-align: justify !important; font-weight: bold; font-style: italic;} | ||
− | /* | + | /* LIST FORMATTING */ |
.content li {width: 99%;} | .content li {width: 99%;} | ||
− | /* | + | /* LINK REFERENCING */ |
a#pageLink:link, a#pageLink:visited {color: #0f0f0f; text-decoration: underline;} | a#pageLink:link, a#pageLink:visited {color: #0f0f0f; text-decoration: underline;} | ||
a#pageLink:hover, a#pageLink:active {color: #f5af3e; text-decoration: underline;} | a#pageLink:hover, a#pageLink:active {color: #f5af3e; text-decoration: underline;} | ||
+ | .content p a {color: darkslategrey !important; text-decoration: underline !important;} | ||
+ | |||
+ | /* WIKI & HTML CONFLICT WORKAROUNDS */ | ||
+ | .content p {font-family: Raleway !important;} | ||
+ | |||
+ | /* ADDED JULY 19 */ | ||
+ | |||
+ | .teamDiv {position:relative;} | ||
+ | .teamDiv h1 {color: black; font-size: 26pt;} | ||
+ | .teamDiv h2 {color: black; font-weight: bold; font-size: 22pt;} | ||
+ | .teamBios {margin-left: 3%; margin-right: 3%; color: black;} | ||
+ | |||
+ | /* | ||
+ | .teamMember { | ||
+ | color: black; | ||
+ | height: 300px; | ||
+ | position: relative;} | ||
+ | |||
+ | .teamMember img { | ||
+ | z-index: 1; | ||
+ | float: left; | ||
+ | width: 250px; | ||
+ | height: 250px; | ||
+ | padding-right: 1%; | ||
+ | position: absolute; bottom: 0; left: 0;} | ||
+ | |||
+ | .teamMember h3 { | ||
+ | font-size: 20pt; | ||
+ | font-weight: bold; | ||
+ | padding: 0.5em; | ||
+ | z-index: 2; | ||
+ | border-style: dotted; | ||
+ | border-color: white !important; | ||
+ | position: absolute; top: -3%; left: 16%;} | ||
− | + | .teamMember p { | |
− | + | z-index: 3; | |
+ | width: 75%; | ||
+ | margin-left: 14em; | ||
+ | position: absolute; bottom: 0%; right: 5%;}*/ | ||
</style> | </style> | ||
</html> | </html> |
Latest revision as of 19:57, 17 October 2018