/* Import global styles */
@import "/static/Global/css/global.css";

/* Style the body */
body {
  font-family: NewTown;
  background: #1C1C1C;
  margin: 0;
  padding: 0;
  text-align: center;

  display: flex;
  flex-direction: column;
}

/* Increase the font size of the headings */
h1, h2 {
  font-size: 3.125vw;
  font-family: HighwayGothic;
  margin: 0;
  color: white;
}

h2 {
  font-size: 2.675vw;
}

p {
  font-family: HighwayGothic;
  font-size: 1.5625vw;
  color: #C9C9C9;
}

ul{
  inline-size: 40%;
}

/* Wrap paragraphs into blocks without using <br> */
.paragraph {
  inline-size: 50%;
  overflow-wrap: break-word;
  margin: auto;

  padding-bottom: 3rem;
}

.main{
  position: relative;
  left:0;
  margin-left: auto;
  margin-right: auto;
}

article{
  display: table;
  text-align:center;
  /* height: 100vh; */
  width: 100%;
  color:white;
  text-decoration: none;
  font-family: HighwayGothic;
}
article p{
  margin: 0;
}
article a{
  text-decoration: none;
  display: inline-block;
  color:white;
  margin-left: auto;
  margin-right: auto;
}

#logoBanner{
  margin: auto;
  padding-top: 1%;
  max-width: 35%;
  max-height: 40%;
}

@media (orientation: portrait) {
  h1{
    font-size: 3rem;
  }
  h2{
    font-size: 2rem;
  }
  p{
    font-size: 1.5rem;
  }
  .paragraph {
    inline-size: 90%;
  }
  #logoBanner{
    max-width: 100%;
    max-height: 100%;
  }
}



.teamMembers{
  /* background-color: #2C2C2C; */
  display: table;
  table-layout: 1fr;
  margin: auto;
}
#teamProfile{
  vertical-align: middle;
  padding: 1rem 2rem;
  text-align: center;
}
/* Name */
#teamProfile h1{
  color: white;
  font-size: 2.5vw;
  margin: 0;
}
/* Title */
#teamProfile h2{
  font-size: 1.75vw;
  color: #0098FF;
  margin: 0;
}
/* Handle */
#teamProfile h3{
  font-size: 1.2vw;
  color: #696969;
  margin: 0;
}

#teamProfile img{
  height: 10rem;
  width: 10rem;
}

@media (orientation: portrait) {
  #teamProfile{
    display: block;
  }
  #teamProfile h1{
    font-size: 3rem;
  }
  #teamProfile h2{
    font-size: 2rem;
  }
  #teamProfile h3{
    font-size: 1.5rem;
  }
  #teamProfile img{
    height: 12rem;
    width: 12rem;
  }
}



#socialMediaLink{
  display: inline-flex;
  align-items: center;
  justify-content: center;

  text-decoration: none;

  padding: 1rem 1rem ;
}
#socialMediaLink:hover{
  background-color: #2F2F2F;
}
.socialLinkHead{
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#socialMediaLink h1{
  display: inline;
  vertical-align: middle;
  color: #0098FF;
  font-size: 2rem;

  margin: 0;
}
#socialMediaLink p{
  display: inline;
  font-size: 1.5rem;
  color: white;
  inline-size: 35%;
  overflow-wrap: break-word;
}
#socialMediaLink p#text{
  margin: auto;
}
#socialMediaLink img{
  display: inline;
  margin: 0;
  width: 7rem;
  height: 7rem;
}
#disclaimer{
  padding-top: 5rem;
  padding-bottom: 3rem;
}

@media (orientation: portrait) {
  .socialLinkHead{
    display: flex;
  }
  #socialMediaLink h1{
    font-size: 1.5rem;
  }#socialMediaLink p{
    inline-size: 90%;
    font-size: 1rem;
  }
  #socialMediaLink img{
    width: 5rem;
    height: 5rem;
  }
}
