|
|
| Line 295: |
Line 295: |
| | | | |
| | | | |
| − |
| |
| − | /*Image section at the top of the page*/
| |
| − | .imagearea {
| |
| − | width:100%;
| |
| − | text-align:center;
| |
| − | height:300px;
| |
| − | background-color:white;
| |
| − | margin: -1px auto 15px auto;
| |
| − | }
| |
| − |
| |
| − | /*When text is used in the imagearea*/
| |
| − | .imagearea h1 {
| |
| − | font-size:110px;
| |
| − | text-align:center;
| |
| − | color:white;
| |
| − | }
| |
| − |
| |
| − | /*Specifications for image at top of page*/
| |
| − | .mainimage {
| |
| − | height:300px;
| |
| − | }
| |
| − |
| |
| − | /*Page title*/
| |
| − | .pagetitle {
| |
| − | margin:0 0 20px 50px;
| |
| − | width:1170px;
| |
| − | height:30px;
| |
| − | }
| |
| − |
| |
| − | /*Box for content on page*/
| |
| − | .content {
| |
| − | width:1100px;
| |
| − | min-height:100px;
| |
| − | margin:25px auto 25px 50px;
| |
| − | padding-bottom: 35px;
| |
| − | display:inline-block;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | /*Paragraph styling*/
| |
| − | .p {
| |
| − | font-family:Sspr;
| |
| − | font-size:17px;
| |
| − | }
| |
| − |
| |
| − | /*Paragraph title styling*/
| |
| − | .ptitle {
| |
| − | font-family:Lato, sans-serif;
| |
| − | font-size:24px;
| |
| − | font-weight:700;
| |
| − | text-align:left;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | .stitle {
| |
| − | font-family:Aleo;
| |
| − | font-size:18px;
| |
| − | font-weight:700;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | .f {
| |
| − | font-family:Lato, sans-serif;
| |
| − | font-size:15px;
| |
| − | text-align:center;
| |
| − | }
| |
| − |
| |
| − | /*Reference box formatting*/
| |
| − | .references {
| |
| − | position:relative;
| |
| − | color:#235c81;
| |
| − | }
| |
| − |
| |
| − | .refbox {
| |
| − | position:absolute;
| |
| − | bottom:26px;
| |
| − | left:50%;
| |
| − | margin-left:-117px;
| |
| − | width:260px;
| |
| − | padding:10px 15px 10px 15px;
| |
| − | background-color:#235c81;
| |
| − | color:white;
| |
| − | visibility:hidden;
| |
| − | font-size:12px;
| |
| − | }
| |
| − |
| |
| − | .references:hover .refbox {
| |
| − | visibility:visible;
| |
| − | }
| |
| − |
| |
| − | .references:hover {
| |
| − | text-decoration:underline;
| |
| − | }
| |
| − |
| |
| − | /*Bottom arrow on refbox*/
| |
| − | .references .refbox::after {
| |
| − | content:" ";
| |
| − | position:absolute;
| |
| − | top:100%;
| |
| − | left:112px;
| |
| − | border-width:5px;
| |
| − | border-style:solid;
| |
| − | border-color:#99d6ff transparent transparent transparent;
| |
| − | }
| |
| − |
| |
| − | /*Image formatting*/
| |
| − | .floatright {
| |
| − | float:right;
| |
| − | background-color:#cce5ff;
| |
| − | padding:15px;
| |
| − | margin-left:10px;
| |
| − | margin-top:3px;
| |
| − | margin-bottom:5px;
| |
| − | }
| |
| − |
| |
| − | .floatleft {
| |
| − | float:left;
| |
| − | background-color:#cce5ff;
| |
| − | padding:15px;
| |
| − | margin-right:10px;
| |
| − | margin-top:3px;
| |
| − | margin-bottom:5px;
| |
| − | }
| |
| − |
| |
| − | .capright {
| |
| − | float:right;
| |
| − | padding:15px 15px 4px 15px;
| |
| − | text-align:center;
| |
| − | font-family:Lato, sans-serif;
| |
| − | font-size:15px;
| |
| − | margin-top:3px;
| |
| − | margin-left:10px;
| |
| − | margin-bottom:2px;
| |
| − | line-height:23px;
| |
| − | }
| |
| − |
| |
| − | .capleft {
| |
| − | float:left;
| |
| − | padding:15px 15px 4px 15px;
| |
| − | background-color:#cce5ff;
| |
| − | text-align:center;
| |
| − | font-family:Lato, sans-serif;
| |
| − | font-size:15px;
| |
| − | margin-top:3px;
| |
| − | margin-right:10px;
| |
| − | margin-bottom:2px;
| |
| − | line-height:23px;
| |
| − | }
| |
| − |
| |
| − | /*Footer*/
| |
| − | .footerspace {
| |
| − | position:fixed;
| |
| − | background-color:#235c81;
| |
| − | left:50%;
| |
| − | margin-left:-600px;
| |
| − | width:1200px;
| |
| − | height:35px;
| |
| − | bottom:-1px;
| |
| − | z-index:50;
| |
| − | }
| |
| − |
| |
| − | .footerright {
| |
| − | float:right;
| |
| − | margin-right:10px;
| |
| − | }
| |
| − |
| |
| − | .footerleft {
| |
| − | float:left;
| |
| − | margin-left:10px;
| |
| − | }
| |
| − |
| |
| − | .footerleft, .footerright {
| |
| − | margin-top:7px;
| |
| − | text-decoration:none;
| |
| − | font-family:Lato, sans-serif;
| |
| − | font-size:17px;
| |
| − | color:white;
| |
| − | }
| |
| − |
| |
| − | .footerleft:hover, .footerright:hover {
| |
| − | text-decoration:underline;
| |
| − | }
| |
| − |
| |
| − | .footerleft:link, .footerright:link, .footerleft:visited, .footerright:visited {
| |
| − | color:white;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | /*Anders' attempt at making clickable links over the p&p infographic*/
| |
| − |
| |
| − | div.abs1{position: absolute;
| |
| − | top: 75px;
| |
| − | right: 875px;
| |
| − | width: 120px;
| |
| − | height: 140px;
| |
| − | }
| |
| − |
| |
| − | div.abs2{position: absolute;
| |
| − | top: 10px;
| |
| − | right: 530px;
| |
| − | width: 150px;
| |
| − | height: 100px;
| |
| − | border: none;
| |
| − | z-index:10;
| |
| − | }
| |
| − |
| |
| − | div.abs3{position: absolute;
| |
| − | top: 95px;
| |
| − | right: 235px;
| |
| − | width: 120px;
| |
| − | height: 175px;
| |
| − | }
| |
| − |
| |
| − | div.abs4{position: absolute;
| |
| − | top: 340px;
| |
| − | right: 195px;
| |
| − | width: 150px;
| |
| − | height: 100px;
| |
| − | }
| |
| − |
| |
| − | div.abs5{position: absolute;
| |
| − | top: 548px;
| |
| − | right: 200px;
| |
| − | width: 155px;
| |
| − | height: 135px;
| |
| − | }
| |
| − |
| |
| − | div.abs6{position: absolute;
| |
| − | top: 585px;
| |
| − | right: 850px;
| |
| − | width: 100px;
| |
| − | height: 145px;
| |
| − | }
| |
| − |
| |
| − | div.abs7{position: absolute;
| |
| − | top: 670px;
| |
| − | right: 420px;
| |
| − | width: 260px;
| |
| − | height: 107px;
| |
| − | }
| |
| − |
| |
| − |
| |
| − | div.public{position: absolute;
| |
| − | top: 560px;
| |
| − | right: 715px;
| |
| − | width: 300px;
| |
| − | height: 300px;
| |
| − | border: none;
| |
| − | }
| |
| − |
| |
| − | div.outreach{position: absolute;
| |
| − | top: 560px;
| |
| − | right: 120px;
| |
| − | width: 300px;
| |
| − | height: 300px;
| |
| − | border: none;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − | div.project1{position: absolute;
| |
| − | top: 70px;
| |
| − | right: 350px;
| |
| − | width: 175px;
| |
| − | height: 175px;
| |
| − | border:none;
| |
| − | z-index:10;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | div.project2{position: absolute;
| |
| − | top: 190px;
| |
| − | right: 515px;
| |
| − | width: 175px;
| |
| − | height: 175px;
| |
| − | border: none;
| |
| − | z-index:10;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | div.project3{position: absolute;
| |
| − | top: 260px;
| |
| − | right: 720px;
| |
| − | width: 175px;
| |
| − | height: 175px;
| |
| − |
| |
| − | z-index:10;
| |
| − | }
| |
| − |
| |
| − | div.project4{position: absolute;
| |
| − | top: 425px;
| |
| − | right: 550px;
| |
| − | width: 175px;
| |
| − | height: 175px;
| |
| − |
| |
| − | z-index:10;
| |
| − | }
| |
| − |
| |
| − | div.project5{position: absolute;
| |
| − | top: 640px;
| |
| − | right: 575px;
| |
| − | width: 175px;
| |
| − | height: 175px;
| |
| − |
| |
| − | z-index:10;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | div.policy{position: absolute;
| |
| − | top: 340px;
| |
| − | right: 715px;
| |
| − | width: 300px;
| |
| − | height: 300px;
| |
| − | border: none;
| |
| − | }
| |
| − |
| |
| − | div.industry{position: absolute;
| |
| − | top: 340px;
| |
| − | right: 190px;
| |
| − | width: 300px;
| |
| − | height: 300px;
| |
| − | border: none;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − |
| |
| − | div.fox1{position: absolute;
| |
| − | top: 150px;
| |
| − | right: -10px;
| |
| − | width: 400px;
| |
| − | height: 100px;
| |
| − |
| |
| − | }
| |
| − |
| |
| − | div.fox2{position: absolute;
| |
| − | top: 280px;
| |
| − | right: 790px;
| |
| − | width: 300px;
| |
| − | height: 100px;
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − | div.fox3{position: absolute;
| |
| − | top: 655px;
| |
| − | right: 700px;
| |
| − | width: 300px;
| |
| − | height: 100px;
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − | div.fox4{position: absolute;
| |
| − | top: 470px;
| |
| − | right: 220px;
| |
| − | width: 300px;
| |
| − | height: 100px;
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − | div.fox5{position: absolute;
| |
| − | top: 90px;
| |
| − | right: 550px;
| |
| − | width: 300px;
| |
| − | height: 100px;
| |
| − |
| |
| − |
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | .fox{
| |
| − | font-family:Aleo;
| |
| − | font-size:20px;
| |
| − | font-weight:100;
| |
| − | text-align:left;
| |
| − | color:#235c81;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | .3col{column-count:3;}
| |
| − |
| |
| − | #vgemcollaboration {
| |
| − | background-image:url('https://static.igem.org/mediawiki/2016/d/de/T--Virginia--collabopen.png');
| |
| − | background-size:180px 220px; /*Adjust background-size and the width and height properties here if you wish to resize the icon*/
| |
| − | width:180px;
| |
| − | height:220px;
| |
| − | z-index:20;
| |
| − | padding:1px
| |
| − | background-color:#ffffff;
| |
| − | margin-top:2px;
| |
| − | margin-left:2px;
| |
| − | margin-bottom:2px;
| |
| − | top:200px;
| |
| − | }
| |
| − |
| |
| − | #vgemcollaboration:hover{
| |
| − | background-image:url('https://static.igem.org/mediawiki/2016/a/a5/T--Virginia--collabclosed.png');
| |
| − | }
| |
| − |
| |
| − | #vgemcollaboration a{
| |
| − | display:inline-block;
| |
| − | width:100%;
| |
| − | height:100%;
| |
| − | }
| |
| − |
| |
| − |
| |
| − |
| |
| − | </style>
| |
| − | </head>
| |
| | | | |
| | | | |
