Difference between revisions of "Team:Virginia/Collaborations"

Line 1: Line 1:
{{Virginia/body}}
+
{{Virginia/menubar}}
 +
{{Virginia/stylesheet}}
 
<html>
 
<html>
<body>
+
<head>
 +
<meta name=viewport content="width=device-width, initial-scale=1">
 +
<style>
  
 +
/********************************* DEFAULT WIKI SETTINGS  ********************************/
  
<div class="maindiv">
+
#sideMenu, #top_title {display:none;}
 +
#content { padding:0px; width:100%; margin-top:-7px; margin-left:0px;}
 +
body {background-color:#ffffff;}
 +
#bodyContent h1, #bodyContent h2, #bodyContent h3, #bodyContent h4, #bodyContent h5 { margin-bottom: 0px; }
  
<!-----------------------------------Space reserved for menu------------------------------------>
+
/********************************* MENU ********************************/
<div id="menuspace"></div>
+
<div class="footerspace">
+
<a href="https://2016.igem.org/Team:Virginia/Team" class="footerleft">&larr; Team</a>
+
<a href="https://2016.igem.org/Team:Virginia/Attributions" class="footerright">Attributions &rarr;</a>
+
</div>
+
  
<!-----------------------------------Container div---------------------------------------------->
+
/*Contains the entire page and everything in it*/
<div class="container">
+
.maindiv {
 +
background-color:#ffffff;
 +
min-height:98vh;
 +
width:100%;
 +
position:absolute;
 +
display:block;
 +
}
  
<!---------------------------Top image on page------------------------------------------>
+
/*Space reserved for the menubar*/
 +
#menuspace {
 +
background-color:none;
 +
width:1200px;
 +
height:48px;
 +
margin:0 auto;
 +
}
  
<div class="imagearea">
 
        <img src="https://static.igem.org/mediawiki/2016/0/01/T--Virginia--Collaborations_header.png">
 
</div>
 
  
 +
/*All of the text, images, etc. of our page goes in this div*/
 +
.container {
 +
/*Padding and margin are a trick to prevent margins collapsing*/
 +
padding-top:1px;
 +
padding-bottom:1px;
  
<!---------------------------Page title area-------------------------------------------->
+
margin:9px auto 14px auto;
<!--<div class="pagetitle">
+
position:relative;
<h1 style="color:#66b3ff">Insert title of page here!</h1>
+
display:block;
</div>-->
+
background-color:white;
 +
width:1200px;
 +
min-height:80vh;
 +
}
  
 +
/*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;
  
<!---------------------------Main content section of page------------------------------->
+
}
<div class="content">
+
  
<div class="capright" id="vgemcollaboration">
+
.stitle {
<a href="https://2016.igem.org/Team:Virginia/Collaborations" target="_blank"></a>
+
        font-family:Aleo;
</div>
+
font-size:18px;
 +
font-weight:700;
  
<p><span class="p">We made efforts to collaborate with other teams and foster mutual development in both their projects and our own. We spoke to several teams and assisted many others in their project by filling out their surveys. In addition, we created our own survey about biocontainment to distribute to iGEM teams and provided a collaboration badge for teams that responded (for the results of our survey and list of teams that participated in the survey click on the collaboration badge to the right). We would like to acknowledge the following teams for collaborating with us throughout the course of iGEM 2016.</span></p><br><br>
+
}
  
 +
.f {
 +
        font-family:Lato, sans-serif;
 +
        font-size:15px;
 +
        text-align:center;
 +
}
  
 +
/*Reference box formatting*/
 +
.references {
 +
position:relative;
 +
color:blue;
 +
}
  
 +
.refbox {
 +
position:absolute;
 +
bottom:26px;
 +
left:50%;
 +
margin-left:-117px;
 +
width:260px;
 +
padding:10px 15px 10px 15px;
 +
background-color:#99d6ff;
 +
color:black;
 +
visibility:hidden;
 +
font-size:12px;
 +
}
  
 +
.references:hover .refbox {
 +
visibility:visible;
 +
}
  
<p><span class="ptitle">Broad Run High School</span></p><br>
+
.references:hover {
+
text-decoration:underline;
<p><span class="p">We discussed kill switch mechanisms at length with the Broad Run team. We also aided their team by providing advice regarding modeling techniques with Matlab software. We helped them successfully model their project by sharing our Matlab expertise.</span></p><br><br>
+
}
  
 +
/*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;
 +
}
  
<p><span class="ptitle">CGU Taiwan</span></p><br>
+
/*Image formatting*/
+
.floatright {
<p><span class="p">One of our team members, Sarah, spoke to Bill and Justine from the CGU Taiwan team. Sarah explained our biocontainment project to Bill and Justine, and they in turn presented their Leijuvant project to her. They had a great follow up discussion about biocontainment and whether or not it is needed for Leijuvant. It was determined that physical containment would best serve their purposes.</span></p><br><br>
+
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;
 +
background-color:#cce5ff;
 +
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;
 +
}
  
<p><span class="ptitle"><strong>UMaryland</strong></span></p><br>
+
/*Footer*/
 +
.footerspace {
 +
position:fixed;
 +
background-color:#235c81;
 +
left:50%;
 +
margin-left:-600px;
 +
width:1200px;
 +
height:35px;
 +
bottom:-1px;
 +
z-index:50;
 +
}
  
<p><span class="p">We had an excellent time visiting UMaryland for the the Mid-Atlantic iGEM conference. We presented our project and heard ideas from not just the UMaryland team, but also the UPitt, William and Mary, and Naval Academy iGEM teams. This was a great opportunity for all teams to share ideas and advice. Members of our team also hosted a dialogue regarding biocontainment. This gave other teams the opportunity to learn about biocontainment and ask questions about the different methods available.</span></p><br><br>
+
.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;
 +
}
  
<p><span class="ptitle">Trinity College Dublin</span></p><br>
+
.footerleft:hover, .footerright:hover {
 +
text-decoration:underline;
 +
}
  
<p><span class="p">Trinity College developed a unique and exciting website called “iGEM Academy”. The academy allows teams to share their work using video media. We submitted an animated short about our project and the more general concept of biocontainment.</span></p><br><br>
+
.footerleft:link, .footerright:link, .footerleft:visited, .footerright:visited {
 +
color:white;
 +
}
  
  
 +
/*Anders' attempt at making clickable links over the p&p infographic*/
  
<p><span class="ptitle"><strong>Vilnius-Lithuania</strong></span></p><br>
+
div.abs1{position: absolute;
 +
    top: 75px;
 +
    right: 875px;
 +
    width: 120px;
 +
    height: 140px;
 +
  }
  
<p><span class="p">We assisted Vilnius-Lithuania in their human practices. They created a comprehensive survey to determine the factors that contribute to a successful iGEM team. We discussed the questions amongst ourselves and responded to their survey.</span></p><br><br>
+
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;
 +
  }
  
<p><span class="ptitle"><strong>XMU China</strong></span></p><br>
+
div.abs5{position: absolute;
 +
    top: 548px;
 +
    right: 200px;
 +
    width: 155px;
 +
    height: 135px;
 +
    }
  
+
div.abs6{position: absolute;
<p><span class="p">We assisted XMU China in their human practices. We completed a survey about antibiotic resistance in bacteria. This was a great opportunity because there was much we did not know about antibiotic resistance. </span></p><br>
+
    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;
 +
}
  
<p><span class="ptitle">Tianjin</span></p><br>
+
div.outreach{position: absolute;
 +
    top: 560px;
 +
    right: 120px;
 +
    width: 300px;
 +
    height: 300px;
 +
    border: none;
 +
}
  
<p><span class="p">The Tianjin team created a questionnaire union comprised of themselves, Pasteur, Pittsburgh, ULV-LC-CV, Valencia UPV, and Virginia. Each team submitted questions regarding their individual projects. Each project was different, so the questionnaire was able to cover a wide range of topics regarding iGEM and synthetic biology.</span></p><br>
 
  
<p><span class="ptitle">EPF Lausanne</span></p><br>
 
  
  
 +
div.project1{position: absolute;
 +
    top: 70px;
 +
    right: 350px;
 +
    width: 175px;
 +
    height: 175px;
 +
    border:none;
 +
z-index:10;
 +
}
  
<p><span class="p">One of our team members, Raquel, interviewed with the EFP Lausanne team. The team hosted a newsletter featuring various iGEM teams. We were fortunate enough to be selected! Raquel spoke at length about her experience with iGEM and shed light on some of the lesser known fun facts about the University of Virginia. We received a badge (below) from EPFL for our collaboration with them.
+
div.project2{position: absolute;
</span></p><br>
+
    top: 190px;
 +
    right: 515px;
 +
    width: 175px;
 +
    height: 175px;
 +
    border: none;
 +
z-index:10;
 +
}
  
<center><img src="https://static.igem.org/mediawiki/2016/4/47/T--Virginia--epfl_badge.extension.png" style="position: relative;float:center;width:474px;height:300px;"></center>
+
div.project3{position: absolute;
 +
    top: 260px;
 +
    right: 720px;
 +
    width: 175px;
 +
    height: 175px;
 +
    border: none;
 +
z-index:10;
 +
}
  
<p><span class="ptitle">Munich United</span></p><br>
+
div.project4{position: absolute;
 +
    top: 425px;
 +
    right: 550px;
 +
    width: 175px;
 +
    height: 175px;
 +
    border: none;
 +
z-index:10;
 +
}
  
<p><span class="p">Munich United created a survey on entrepreneurship in iGEM entitled "Enabling Factors in Biotech." We completed the survey and received a contribution badge from Munich United.
+
div.project5{position: absolute;
</span></p><br>
+
    top: 640px;
 +
    right: 575px;
 +
    width: 175px;
 +
    height: 175px;
 +
    border: none;
 +
z-index:10;
 +
}
  
  
<center><a href="https://2016.igem.org/Team:LMU-TUM_Munich/Supporting_Entrepreneurship" target="_blank"> <img id="Munich_2016_badge" width="200px" src="https://static.igem.org/mediawiki/2016/1/12/Muc16_collaboration_badge_001.png" alt="This team completed LMU-TUM_Munich's survey on Entrepreneurship in the iGEM community."/> </a> <img src="https://static.igem.org/mediawiki/2016/1/12/Muc16_collaboration_badge_001.png" style="display:none"> <audio  id="mp3" preload="auto"> <source src="https://static.igem.org/mediawiki/2016/d/d3/Supporting_Entrepreneurship.mp3" type="audio/mp3" /> <source src="https://static.igem.org/mediawiki/2016/1/19/Supporting_Entrepreneurshipo.ogg" type="audio/ogg" /> </audio> <script> document.getElementById('Munich_2016_badge'). onmouseover = function() {
 
  
  this.src='https://static.igem.org/mediawiki/2016/4/4f/Survey-Badge_001B.png';
+
div.policy{position: absolute;
 +
    top: 340px;
 +
    right: 715px;
 +
    width: 300px;
 +
    height: 300px;
 +
    border: none;
 +
}
  
  document.getElementById("mp3") .play();
+
div.industry{position: absolute;
 +
    top: 340px;
 +
    right: 190px;
 +
    width: 300px;
 +
    height: 300px;
 +
    border: none;
 +
}
  
  }
 
  
 
  
document.getElementById('Munich_2016_badge'). onmouseout= function() {
 
  
  this.src='https://static.igem.org/mediawiki/2016/b/b5/Survey-Badge_001A.png'
 
  
  }
 
  
</script></center>
+
div.fox1{position: absolute;
</div>
+
    top: 120px;
 +
    right: 50px;
 +
    width: 300px;
 +
    height: 100px;
 +
   
 +
}
 +
 
 +
div.fox2{position: absolute;
 +
    top: 280px;
 +
    right: 760px;
 +
    width: 300px;
 +
    height: 100px;
 +
   
 +
}
 +
 
 +
div.fox3{position: absolute;
 +
    top: 690px;
 +
    right: 660px;
 +
    width: 300px;
 +
    height: 100px;
 +
   
 +
}
 +
 
 +
div.fox4{position: absolute;
 +
    top: 470px;
 +
    right: 210px;
 +
    width: 300px;
 +
    height: 100px;
 +
   
 +
}
 +
 
 +
div.fox5{position: absolute;
 +
    top: 120px;
 +
    right: 560px;
 +
    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>
  
</div>
 
</div>
 
</body>
 
 
</html>
 
</html>

Revision as of 04:57, 19 October 2016