Line 16: | Line 16: | ||
font-size: 5.5em; | font-size: 5.5em; | ||
text-align: center; | text-align: center; | ||
+ | margin-bottom: 0.25em; | ||
} | } | ||
.main_divider{ | .main_divider{ | ||
− | size: .5em; | + | size: 0.5em; |
− | width: | + | width: 50%; |
alignment-adjust: central; | alignment-adjust: central; | ||
border: none; | border: none; | ||
− | border-top: . | + | border-top: .5em dotted; |
} | } | ||
Line 30: | Line 31: | ||
font-family: Helvetica; | font-family: Helvetica; | ||
font-size: 2em; | font-size: 2em; | ||
+ | margin-left: 6em; | ||
+ | margin-right: 6em; | ||
+ | text-align: center; | ||
} | } | ||
.team_photos_container{ | .team_photos_container{ | ||
− | margin-top: | + | margin-top: 1em; |
− | margin-bottom: | + | margin-bottom: 1.5em; |
+ | margin-left: 5em; | ||
+ | margin-right: 5em; | ||
} | } | ||
+ | |||
+ | .resize{ | ||
+ | padding: 0.5em; | ||
+ | height: 10em; | ||
+ | width: auto; | ||
+ | } | ||
− | . | + | .slideshow_background{ |
− | + | background-color: #5C7A8A; | |
+ | display: table-cell; | ||
+ | width: 50em; | ||
+ | height: 25em; | ||
+ | border-left: 15em solid white; | ||
} | } | ||
− | + | ||
− | + | .slideshow_background .image_container{ | |
− | + | display: inline-block; | |
− | + | vertical-align: middle; | |
− | + | width: 20em; | |
− | + | height: 22em; | |
− | + | margin: 1.5em 0em 0em 2em; | |
− | + | ||
− | + | ||
− | + | ||
} | } | ||
− | + | ||
− | + | .text_container{ | |
− | + | display: inline-block; | |
− | + | vertical-align: top; | |
+ | width: 25em; | ||
+ | height: 22em; | ||
+ | margin: 1.5em 0em 0em 1.2em; | ||
} | } | ||
− | + | ||
− | + | .title_container{ | |
− | + | display: inline-block; | |
− | + | width: 20em; | |
− | + | height 3em; | |
− | + | margin: 1em 0em 0em 2.5em; | |
− | + | ||
} | } | ||
− | </script> | + | |
+ | .body_container{ | ||
+ | width: auto; | ||
+ | height: 16.5em; | ||
+ | margin: 1em 1em 1em 1em; | ||
+ | } | ||
+ | |||
+ | .slideshow_resize{ | ||
+ | height: 20em; | ||
+ | margin-top: 1em; | ||
+ | } | ||
+ | |||
+ | .slideshow_title{ | ||
+ | font-family: 'Myriad Pro'; | ||
+ | font-style: italic; | ||
+ | font-size: 3em; | ||
+ | margin: 0; | ||
+ | color: #FFFFFF; | ||
+ | text-align: center; | ||
+ | } | ||
+ | |||
+ | .slideshow_body{ | ||
+ | margin: 0.25em; | ||
+ | text-align: left; | ||
+ | color: white; | ||
+ | font-size: 1.5em; | ||
+ | } | ||
+ | |||
+ | .spacer{ | ||
+ | background-color: #FFFFFF; | ||
+ | height: 5em; | ||
+ | } | ||
+ | </style> | ||
+ | |||
+ | <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script> | ||
+ | <script> | ||
+ | $(document).ready(function(){ | ||
+ | var current = $("#num1"); | ||
+ | var next = $("#num2"); | ||
+ | var other = $("#num3"); | ||
+ | |||
+ | $("#sarah").on("click", function(){ | ||
+ | current.toggle(500); | ||
+ | next.toggle(500); | ||
+ | }) | ||
+ | |||
+ | $("#kira").on("click", function(){ | ||
+ | current.toggle(500); | ||
+ | other.toggle(500); | ||
+ | }) | ||
+ | }) | ||
+ | </script> | ||
</head> | </head> | ||
Line 70: | Line 136: | ||
<h1 class="main main_title">Meet the Team</h1> | <h1 class="main main_title">Meet the Team</h1> | ||
<hr class="main main_divider"> | <hr class="main main_divider"> | ||
− | <h1 class="small_body">With team members from 6 different high | + | <h1 class="small_body">With team members from 6 different high schools, the Tacoma RAINMakers have built an effective and diverse team.</h1> |
<div class="team_photos_container"> | <div class="team_photos_container"> | ||
− | + | <img class="resize" id="sarah" src="https://static.igem.org/mediawiki/2018/3/3b/T--Tacoma_RAINMakers--Sarah_Bortel.png" alt="Sarah Bortel" /> | |
− | + | <img class="resize" id="kira" src="https://static.igem.org/mediawiki/2018/4/4e/T--Tacoma_RAINMakers--Kira_Boyce.png" alt="Kira Boyce" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/f/f1/T--Tacoma_RAINMakers--Kian_Croston.png" alt="Kian Croston" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/d/df/T--Tacoma_RAINMakers--Ian_Gutierrez.png" alt="Ian Gutierrez" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/9/99/T--Tacoma_RAINMakers--Anna_Haddad.png" alt="Anna Haddad" /> | |
− | + | <img class="resize" src="" alt="Keshava Katti" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/3/33/T--Tacoma_RAINMakers--James_Lee.png" alt="James Lee" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/f/f1/T--Tacoma_RAINMakers--Michael_Martin.png" alt="Michael Martin" /> | |
− | + | <img class="resize" src="" alt="Jaskiran Pental" /> | |
− | + | <img class="resize" src="" alt="Brendan Studebaker" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/b/b4/T--Tacoma_RAINMakers--Leon_Wan.png" alt="Leon Wan" /> | |
− | + | <img class="resize" src="" alt="Heidi Xu" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/e/ea/T--Tacoma_RAINMakers--Madelyn_Yeh.png" alt="Madelyn Yeh" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/6/6f/T--Tacoma_RAINMakers--Jonathan_Zacarias.png" alt="Jonathan Zacarias" /> | |
− | + | <img class="resize" src="" alt="Amanda Galuszka" /> | |
− | + | <img class="resize" src="" alt="Kristine Grace" /> | |
− | + | <img class="resize" src="https://static.igem.org/mediawiki/2018/5/51/T--Tacoma_RAINMakers--David_Hirschberg.png" alt="David Hirschberg" /> | |
− | + | <img class="resize" src="" alt="Judy Nguyen" /> | |
− | + | <img class="resize" src="" alt="Susan Xu" /> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
− | <div class=" | + | <div class="slideshow_background" id="jump_here"> |
− | + | <div class="image_container"> | |
− | < | + | <img class="slideshow_resize" id="num1" src="https://static.igem.org/mediawiki/2018/e/ea/T--Tacoma_RAINMakers--Madelyn_Yeh.png" alt="Madelyn Yeh" /> |
− | + | <img class="slideshow_resize" id="num2" src="https://static.igem.org/mediawiki/2018/3/3b/T--Tacoma_RAINMakers--Sarah_Bortel.png" alt="Sarah Bortel" /> | |
− | + | <img class="slideshow_resize" id="num3" src="https://static.igem.org/mediawiki/2018/4/4e/T--Tacoma_RAINMakers--Kira_Boyce.png" alt="Kira Boyce" /> | |
− | + | </div> | |
− | + | <div class="text_container"> | |
− | + | <div class="title_container"> | |
− | + | <h3 class="slideshow_title">Madelyn Yeh</h3> | |
− | + | </div> | |
− | + | <div class="body_container"> | |
− | + | <p class="small_body slideshow_body">Madelyn is a real swell gal. Intelligent, kind, and full of puns, she brightens up the lab and works hard while smiling, and making others better.</p> | |
− | + | </div> | |
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
− | + | ||
</div> | </div> | ||
</div> | </div> | ||
− | + | ||
+ | <div class="spacer"></div> | ||
</body> | </body> | ||
+ | |||
+ | <!-- No clue why I have to enter in Title and Body for the containers to appear. --> | ||
</html> | </html> |
Revision as of 15:49, 15 August 2018