body {
  color: white;
  font-family: "pangolin";
  font-size: 1.25rem;
  background-color: black;
  background-size: cover;
  width: 50%;
  margin: 0 auto;
  
}
       
.scale-shadow-image {
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);
  transition: all 0.5s ease;
}
  
.scale-shadow-image:hover {
  transform: scale(1.1);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.6);
}

/* <img src="your-image.jpg" class="scale-shadow-image"> */

#scream {
  animation-name: hi;
  animation-duration: 2s;
  animation-iteration-count: infinite;
  line-height: 0em;
  bottom: -5px;
  position: relative;
  font-size: 2.5rem;
  text-align: center;
}
                          
@keyframes hi {
  0% {
  transform: rotate(5deg);
  }                       
  50% {
  transform: rotate(-5deg);
  }                    
  100% {
  transform: rotate(5deg);
  }
}

/* <div id="scream"> tilting text</div>*/

.container {
  margin: 0 auto;
  padding: 50px;
  text-align: center;
}
.head {
  padding-top: 250px;
}
.bottom {
  font-size:.75rem;
  padding-top: 25px;
}

a {
  color: lightblue;
}

a:hover {
  color: white;
}

.proj {
  margin: 0 auto;
  padding: 25px 50px 25px 50px;
  text-align: center;
}

@media screen and (max-width: 600px) {
    body {
        width: 100%;
}}