wemet.html

---
layout: alone
title: WeMET
show_title: false
permalink: /wemet/
tags: wemet
---


<style>

* {box-sizing: border-box}
.mySlides {display: none}
img {vertical-align: middle}
.mySlides img {height: 600px}

/* Slideshow container */
.slideshow-container {
  max-width: 1000px;
  position: relative;
  margin: auto;
}

/* Next & previous buttons */
.prev, .next {
  cursor: pointer;
  position: absolute;
  top: 50%;
  width: auto;
  padding: 16px;
  margin-top: -22px;
  color: white;
  font-weight: bold;
  font-size: 18px;
  transition: 0.6s ease;
  border-radius: 0 3px 3px 0;
}

/* Position the "next button" to the right */
.next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

/* On hover, add a black background color with a little bit see-through */
.prev:hover, .next:hover {
  background-image: none;
  background-color: rgba(0,0,0,0.8);
}

/* Caption text */
.text {
  color: #0d0d0d;
  background-color: #f2f2f2;
  opacity: .7;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  bottom: 8px;
  width: 100%;
  text-align: center;
}

/* Number text (1/3 etc) */
.numbertext {
  color: #0d0d0d;
  background-color: #f2f2f2;
  opacity: .7;
  font-size: 12px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

/* The dots/bullets/indicators */
.dot {
  cursor: pointer;
  height: 15px;
  width: 15px;
  margin: 0 2px;
  background-color: #bbb;
  border-radius: 50%;
  display: inline-block;
  transition: background-color 0.6s ease;
}

.active, .dot:hover {
  background-color: #717171;
}

/* Fading animation */
.fade {
  -webkit-animation-name: fade;
  -webkit-animation-duration: 1.5s;
  animation-name: fade;
  animation-duration: 1.5s;
}

@-webkit-keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

@keyframes fade {
  from {opacity: .4}
  to {opacity: 1}
}

/* On smaller screens, decrease text size */
@media only screen and (max-width: 450px) {
  .prev, .next,.text {font-size: 11px}
  .mySlides img {height: 300px}
}

.btn {
background-color: #A0D4A4;
color: white;
padding: 5px 10px;
text-align: center;
display: inline-block;
cursor: pointer;
border-radius: 6px
}
.btn:hover {
    background-color: #999;
}

.link {
color: #FF9900;
text-decoration: none;
}
.link:hover {
    color: black;
    text-decoration: none;
}
hr {
    border: none;
    height: 1px;
    color: #333;
    background-color: #333;
    margin: -5px;
}
table {
  border-top: 0px solid #333;
}
td, th {
  text-align: left;
}

</style>

<div>
  <h1 class="h2">WeMET</h1>
  <p>Women in Mechanical Engineering Tea<br />
  Next Meeting: Thursday, November 21st, from 4-5 PM<br />
  Goodwin Hall, Room 440<br />
  Please feel free to come and go as you please during the meeting time. We understand that a 1-hour time commitment may not be possible for everyone.<br />
  </p>
</div>


<div class="home">
  <div class="slideshow-container">
    {% assign image_count = 5 %}
    <div class="mySlides fade">
      <img src="{{ site.baseurl }}/images/photos/wemet1.jpg" style="width:100%; height:600px; border-radius: 15px; object-fit: cover;">
    </div>
    <div class="mySlides fade">
      <img src="{{ site.baseurl }}/images/photos/wemet2.jpg" style="width:100%; height:600px; border-radius: 15px; object-fit: cover;">
    </div>
    <div class="mySlides fade">
      <img src="{{ site.baseurl }}/images/photos/wemet3.jpg" style="width:100%; height:600px; border-radius: 15px; object-fit: cover;">
    </div>
    <div class="mySlides fade">
      <img src="{{ site.baseurl }}/images/photos/wemet4.jpg" style="width:100%; height:600px; border-radius: 15px; object-fit: cover;">
    </div>
    <div class="mySlides fade">
      <img src="{{ site.baseurl }}/images/photos/wemet5.jpg" style="width:100%; height:600px; border-radius: 15px; object-fit: cover;">
    </div>        
  	<a class="prev" onclick="plusSlides(-1)">&#10094;</a>
  	<a class="next" onclick="plusSlides(1)">&#10095;</a>
  </div>
  <div style="text-align:center">
	{% for i in (1..image_count) %}
	  <span class="dot" onclick="currentSlide({{ i }})"></span>
	{% endfor %}
</div>

<!-- <div>
  <br>
<img src="{{ site.baseurl }} /images/photos/wemet.jpg" style="width:100%; height:100%; border-radius: 15px">
</div> -->

<div>
  <h3>Description</h3>
  <p>Women in Mechanical Engineering Tea (WeMET) provides an opportunity for Virginia Tech graduate students
    across different research groups to get to know each other, socialize, discuss the highs and lows of
    graduate school, and foster diversity.
    WeMET aims to support members of the Virginia Tech ME community who
    identify as women, trans, non-binary, or gender nonconforming, and we welcome participants of all genders.
  </p>
</div>

<div>
  <h3>Contact</h3>
  <p>
  Feel free to join our <a href=https://join.slack.com/t/wemet-vt/shared_invite/zt-2qefzg353-QqY4oCzXwauX0yMraHgKug>Slack Channel</a>!<br>
  For more information contact Maya Keely (mayakeely@vt.edu) or Jyotshna Bali (jyotshna@vt.edu)</p>
</div>




<script>
var slideIndex = 1;
showSlides(slideIndex);

function plusSlides(n) {
  showSlides(slideIndex += n);
}

function currentSlide(n) {
  showSlides(slideIndex = n);
}

function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("dot");
  if (n > slides.length) {slideIndex = 1}
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none";
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
  slides[slideIndex-1].style.display = "block";
  dots[slideIndex-1].className += " active";
}
</script>