@import url('https://fonts.googleapis.com/css2?family=Londrina+Shadow&family=Montserrat:wght@500&family=New+Rocker&family=Poppins:wght@100;300&family=Teko:wght@300&family=Ubuntu:ital,wght@1,300&display=swap');

* {
  margin: 0;
}

body {
  background-color: black;
  font-family: montserrat;
}

.container {
  margin: 10%;
}

.title1, .title2, .title3{
  
  height: 50%;
  /* margin-top: 8vh; */
  margin: 4vh, 0, 4vh;
  margin-left: 15%;
  margin-right:35%;
  /* padding-left: 10%; */
  /* border: 3px solid rgb(26, 24, 24); */
  text-align: left;

}

/* .title2 {
  
  height: 8vw;
  margin-top: 8vh;
  border: 3px solid rgb(26, 24, 24);
  text-align: center;
} */

/* .title3 {
  
  height: 8vw;
  margin-top: 8vh;
  border: 3px solid rgb(26, 24, 24);
  text-align: center;
} */

h1 {
  margin: auto 0;
  font-size: 9vw;
}


a, a:visited {
  text-decoration: none;
  color: inherit;
}

.hello span {
  display: inline-block;
  color: white;
}

.hello a {
  display: none;
}

.about  a {
  display: inline-block;
  color: white;
}

.about {
  transition: padding-left 1500ms;
}

.about:hover {
  padding-left: 5vh;
}

.about span {
  display: none;
}

.iam span {
  display: inline-block;
  color: red;
}

.iam a {
  display: none;
}

.work  a {
  display: inline-block;
  color: red;
}

.work {
  transition: padding-left 1500ms;
}

.work:hover {
  padding-left: 5vh;
}

.work span {
  display: none;
}

.walter span {
  display: inline-block;
  color: red;
}

.walter a {
  display: none;
}

.contact  a {
  display: inline-block;
  color: red;
}

.contact span {
  display: none;
}

.contact {
  transition: padding-left 1500ms;
}

.contact:hover {
  padding-left: 5vh;
}