/* make the background light blue and change all the fonts to courier */
body {
  background-color: lightblue;
  font-family: courier;
}
/* Using class to make CCS styling easier */

/* random disclaimer, messed around with the margins so it would look like a regular disclaimer */
.disclaimerforfun {
  font-size: 12px;
  margin-top: -20px;
  margin-left: -4px;
}

/* CCS Styling title: color change, background change, added space between the regular styling and ccs styling, added solid border, moved it to the center. */
.CCStitle {
  color: cyan;
  text-align: center;
  background-color: magenta;
  margin-top: 50px;
  border: 5px solid blue;
}
/* color change, background change, dotted border, added padding because the "T" in "This" was too close to the right for my liking. */
.CCSparagraph {
  color: red;
  background-color: orange;
  border: 5px dotted pink;
  padding: 5px;
}
/* Made the image a bit bigger, added a double border, and added a border radius to round the corners */
.CCSimage {
  width: 350px;
  border: 10px double black;
  border-radius: 50px;
}
/* Same as the first paragraph with different colors and a different border. */
.CCSparagraph2 {
  color: lime;
  background-color: purple;
  border: 5px ridge gold;
  padding: 5px;
}

/* Transform, Transition, Animation */


/* makes the transition 2 seconds */
.transform {
  transition: 2s;
}
/* makes it so when you hover over the image it grows 1.5x */
.transform:hover {
  transform: scale(1.5);
}
/* auto margins the image so it is not on the edge. This way it doesn't go over the edge. added 50px margin to bottom so it wouldn't cover the animation */
.transform {
  display: block;
  margin: auto;
  margin-bottom: 50px;
}
/* animation for text */
.animation {
  animation-name: move; 
  animation-duration: 2s;
  animation-iteration-count: infinite;
}

@keyframes move {
  0% {
    margin-left:0px;
  }
  50% {
    margin-left: 500px;
  }
  100% {
    margin-left: 0px;
  }
}