@import url('https://fonts.googleapis.com/css2?family=Work+Sans:ital,wght@1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Share+Tech&family=Work+Sans:ital,wght@1,500&display=swap');
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@500&family=Share+Tech&family=Work+Sans:ital,wght@1,500&display=swap');

* {
  padding: 0;
  margin: 0;
  font-family: "Share Tech", sans-serif;
}

body {
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.8);
}

/*Section 1 */

.sec1 {
  display: grid;
  grid-template-columns: 50% 50%;
  width: 100vw;
  height: 100vh;
}

.titleImg, .titleSec, .navLinks {
  grid-row: 1;
}

.titleImg {
  grid-column: 1 / 3;
  text-align: right;
}

.navLinks {
  grid-column: 2/3;
  
  text-align: center;

  margin-top: 1em;
}

.sec1 li {
  font-size: 2em;
  display: inline;
  /*margin: 1em;*/
  color: whitesmoke;
}

.titleSec {
  grid-column: 1 / 2;
  

  text-align: center;
  font-family: 'DM Sans', sans-serif;
  font-size: 2.7em;
  color: rgb(245, 224, 224);
  
}

#bpTitle {
  font-family: 'Work Sans', sans-serif;
  color: rgb(137, 6, 69);
  margin-top: 0.5em;
  
}

#gwcTitle {
  font-size: 2.03em; 
}

#caption {
   font-size: 0.56em;
   margin: 1em;
 }

#bpTitle, #gwcTitle, #caption {
  background-color: rgb(12, 12, 12);
  background-color: rgba(12, 12, 12, 0.8);
}

/* Section 2 */

.sec2 {
  display: grid;
  /*Changed repeat(3,1fr);*/
  grid-template-columns: 33% 33% 33%;
  grid-template-rows: 33% 33% 33%;
  font-size: 1.5em;
  margin: 0.5em 1em 1em 1em;
}

.sec2 a {
  color: pink;
  font-size: 1.3em;
}

.sec2 a:hover {
  color: blueviolet;
  
}

.sec2 h1 {
  color: whitesmoke;
  margin-bottom: 1.5em;
}

.project1, .project2, .project3, .project4, .project5, .project6 {
  margin-top: 2em;
  margin-bottom: 3em;
  text-align: center;
}

#projectTitle {
  text-align: center;
  font-size: 4.5em;
  color: whitesmoke;
}

hr {
  margin: 2em 0;
}

/*Deleted grid-columns for project classes*/