Difference between revisions of "Team:ASIJ Tokyo/Team"

Line 2: Line 2:
 
{{:Team:ASIJ_Tokyo/bar}}
 
{{:Team:ASIJ_Tokyo/bar}}
 
<html>
 
<html>
 +
  <head>
 +
    <link rel="stylesheet" href="iGEM_stylesheet.css" >
 +
  </head>
 +
 
<style>
 
<style>
 +
 +
    #top {
 +
      height:840px;
 +
    }
 +
 +
    #top img{
 +
      width:100%;
 +
    }
 +
 
#member {
 
#member {
 
position: relative;
 
position: relative;
−
height: 600px;
+
height: 700px;
−
width: 320px;
+
width: 310px;
−
margin: 20px;
+
margin: 10px;
−
border-radius: 20px;
+
  
 
background-color: #e8ebf0;
 
background-color: #e8ebf0;
Line 14: Line 26:
 
}
 
}
  
−
#member-text {
+
    #member img{
−
position: relative;
+
      position:relative;
−
top: 280px;
+
      width: 200px;
 +
      height: 200px;
 +
      top: -300px;
 +
      left: -70px;
 +
      border-radius: 50%;
 +
    }
 +
 
 +
.member-text {
 +
position: absolute;
 +
top: 300px;
 
width: 280px;
 
width: 280px;
 
margin: 20px;
 
margin: 20px;
Line 22: Line 43:
  
 
.pinkbox {
 
.pinkbox {
−
position: relative;
+
position: absolute;
−
top: 280px;
+
top: 320px;
 
left: 130px;
 
left: 130px;
 
height: 5px;
 
height: 5px;
 
width: 60px;
 
width: 60px;
−
border-radius: 2px;
 
 
background-color: #e17785;
 
background-color: #e17785;
 
}
 
}
  
−
.pinkbox h2{
+
.pinkbox h1{
−
position: relative;
+
      position: absolute;
−
text-align: center;
+
      top: -70px;
−
top: -40px;
+
      width: 300px;
−
}
+
      text-align: left;
 +
      font-weight: 100;
 +
    }
 +
   
 +
    .pinkbox h2{
 +
      position:absolute;
 +
      top: -100px;
 +
      font-weight: 100;
 +
    }
 
</style>
 
</style>
  
−
<body>
+
<main>
−
<h1>Team Members</h1>
+
<div id = "top">
−
 
+
  <img src = "https://static.igem.org/mediawiki/2018/c/cc/T--ASIJ_Tokyo--teamphoto.jpg">
−
<div id="member">
+
  <h1>Team Members</h1>
−
<div class = "pinkbox">
+
−
<h2>Saloni Agarwal</h2>
+
−
</div>
+
−
<div id = "member-text">
+
−
<p>Hi, my name is Saloni. I am 17 and currently in the 12th grade. I attend the American School in Japan. I've only been to one school my entire life so I haven't seen much of any other school. I was born and raised in Japan but grew up in an Indian house hold. Some of my hobbies, other than science, include art and music.</p>
+
−
</div>
+
 
</div>
 
</div>
  
 
<div id="member">
 
<div id="member">
−
<div id = "member-text">
+
    <div class = "pinkbox">
−
<p>Test</p>
+
      <img src = "https://upload.wikimedia.org/wikipedia/commons/4/4e/Albert_Einstein_1947_square_cropped.jpg">
−
</div>
+
      <h2 style = "left: -5px">Senior</h2>
 +
      <h1 style = "left:-70px">Albert Einstein</h1>
 +
    </div>
 +
    <div class = "member-text">
 +
      <p>This is just an example of some sample text that you could have in this box. Really, you could have information about where you were born, where you lived, what your favorite subject is, why you chose to do iGEM, what you plan to do in the future, all that jazz. But here it's just for alignment purposes.</p>
 +
    </div>
 
</div>
 
</div>
  
 
<div id="member">
 
<div id="member">
−
<div id = "member-text">
+
    <div class = "pinkbox">
−
<p>Test</p>
+
      <img src = "https://upload.wikimedia.org/wikipedia/commons/6/6e/Mona_Lisa_bw_square.jpeg">
−
</div>
+
      <h2 style = "left: 0px">Junior</h2>
 +
      <h1 style = "left:-80px">Lisa Gherardini</h1>
 +
    </div>
 +
    <div class = "member-text">
 +
      <p>This is just an example of some sample text that you could have in this box. Really, you could have information about where you were born, where you lived, what your favorite subject is, why you chose to do iGEM, what you plan to do in the future, all that jazz. But here it's just for alignment purposes.</p>
 +
    </div>
 
</div>
 
</div>
  
 
<div id="member">
 
<div id="member">
−
<div id = "member-text">
+
    <div class = "pinkbox">
−
<p>Test</p>
+
      <img src = "https://cdn.invitations4u.com/media/type/image/vincent_van_gogh_self_portrait_invitation-rf3b1c2568133467181f02a61222a5a57_zk918_530.jpg">
−
</div>
+
      <h2 style = "left: -35px">Sophomore</h2>
 +
      <h1 style = "left:-100px">Vincent van Gogh</h1>
 +
    </div>
 +
    <div class = "member-text">
 +
      <p>This is just an example of some sample text that you could have in this box. Really, you could have information about where you were born, where you lived, what your favorite subject is, why you chose to do iGEM, what you plan to do in the future, all that jazz. But here it's just for alignment purposes.</p>
 +
    </div>
 
</div>
 
</div>
  
−
<div id="member">
+
</main>
−
<div id = "member-text">
+
−
<p>Test</p>
+
−
</div>
+
−
</div>
+
−
 
+
−
<div id="member">
+
−
<div id = "member-text">
+
−
<p>Test</p>
+
−
</div>
+
−
</div>
+
−
 
+
−
<div id="member">
+
−
<div id = "member-text">
+
−
<p>Test</p>
+
−
</div>
+
−
</div>
+
−
 
+
−
<div id="member">
+
−
<div id = "member-text">
+
−
<p>Test</p>
+
−
</div>
+
−
</div>
+
−
</body>
+
 
</html>
 
</html>

Revision as of 08:52, 14 October 2018

Team Members

Senior

Albert Einstein

This is just an example of some sample text that you could have in this box. Really, you could have information about where you were born, where you lived, what your favorite subject is, why you chose to do iGEM, what you plan to do in the future, all that jazz. But here it's just for alignment purposes.

Junior

Lisa Gherardini

This is just an example of some sample text that you could have in this box. Really, you could have information about where you were born, where you lived, what your favorite subject is, why you chose to do iGEM, what you plan to do in the future, all that jazz. But here it's just for alignment purposes.

Sophomore

Vincent van Gogh

This is just an example of some sample text that you could have in this box. Really, you could have information about where you were born, where you lived, what your favorite subject is, why you chose to do iGEM, what you plan to do in the future, all that jazz. But here it's just for alignment purposes.