html {
  scroll-behavior: smooth;
}

body {
  text-align: center;
}

nav {
  background: gray;
  height: 25px;
  width: 40%;
  position: fixed;
  left: 55%;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}

@media (max-width: 1080px) and (max-height: 2160px) {
  nav {
    position: fixed;
    left: 0px;
    width: 100%;
  }
}
li {
  display: inline-block;
  margin-top: 5px;
  width: 20%;
  text-align: justify;
  position: relative;
  top: -17px;
  font-family: times;
  text-shadow: 1px 1px 1px #000,  3px 3px 5px blue;
}

/*#welcome{
  position:absolute;
  top:50%;
  left:50%;
  color:blue;
  font-style:italic;
  font-family:Helvetica;
}*/
#welcome-section {
  padding-top: 45vh;
  min-height: 55vh;
  font-family: Lobster;
  background-image: url("https://i.postimg.cc/HsNNyzx2/paul-green-185397-unsplash-min.jpg");
}

a {
  text-decoration: none;
  color: yellow;
}

a:hover {
  color: orange;
}

#projects {
  margin-top: -20px;
  padding-top: 60px;
  background-image: url("https://i.postimg.cc/VvN8YFsC/joanna-kosinska-433799-unsplash-min.jpg");
  height: auto;
}

@media (max-width: 1080px) and (max-height: 2160px) {
  #projects {
    padding-top: 30px;
  }
}
.project-tile {
  color: red;
  font-family: Lobster;
}

.project {
  border: 1px solid #ccc;
  border-radius: 5px;
  height: 320px;
  width: 299px;
  margin: 20px;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.19), 0 6px 6px rgba(0, 0, 0, 0.23);
}

.left {
  display: inline-block;
}

.left:hover {
  border-color: gray;
  border-width: 3px;
}

.right {
  display: inline-block;
}

.right:hover {
  border-color: orange;
  border-width: 3px;
}

p {
  color: orange;
}

#name {
  color: red;
  text-shadow: 1px 1px 1px #000;
}

#about {
  margin-top: -25px;
  background-image: url("https://i.postimg.cc/nhqC04QD/dylan-freedom-Fn-TV9-DWdl-Pw-unsplash.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: auto;
  text-align: left;
}

#rule {
  margin-top: -25px;
  width: 9%;
  border-color: yellow;
}

@media (max-width: 1080px) and (max-height: 2160px) {
  #about {
    padding-top: 5px;
  }

  #rule {
    width: 30%;
  }
}
#footer {
  padding: 10px;
  background-color: gray;
}

#footer_lobster_text {
  color: red;
  font-family: Lobster;
  text-shadow: 1px 1px 1px #000;
}

#profile-link {
  font-size: 30px;
  color: cyan;
  background-color: #ffffff;
  border-radius: 20%;
  padding: 10px;
}

#profile-link:hover {
  color: #ffffff;
  background-color: cyan;
}

.moveMe {
  margin-left: 15px;
}

.title {
  opacity: 1;
  -webkit-transition: all 0.7s ease-in-out;
  transition: all 0.7s ease-in-out;
  /* Fixed CSS:
  z-index: 9999;
  position: fixed;
  */
}

.textShadow {
  text-shadow: 1px 1px 1px #000;
}