/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: white;
  color: black;
  font-family: Verdana;
}

  p {
    margin-bottom: 20px; /* Adds 20 pixels of space after each paragraph */
    margin-left: 50px; /* Indents the text from the left edge */

  }
   h1 {
    margin-bottom: 20px; /* Adds 20 pixels of space after each paragraph */
    margin-left: 50px; /* Indents the text from the left edge */

   }
   h3 {
    margin-top: 20px; /* Adds 20 pixels of space after each paragraph */
    margin-left: 50px; /* Indents the text from the left edge */

  }
   img {
    margin-bottom: 20px; /* Adds 20 pixels of space after each paragraph */
   }
   img {
    margin-top: 20px; /* Adds 20 pixels of space after each paragraph */
  }
  img {
    margin-bottom: 20px; /* Adds 20 pixels of space after each paragraph */
  }
  li {
      margin-left: 50px; /* Indents the text from the left edge */
  }
      
.star-bullet {
  list-style-type: "☆"; /* Use a star character directly */
  padding-left: 1em;    /* Adjust padding to prevent overlap */
}


/* RGB EFFECT */

.rgb-animate {
	animation-iteration-count: infinite;
	animation-duration: 40s;
	animation-name: rgb_anim;
}

/* RGB HOVER EFFECT */

.rgb-animate-hvr:hover {
	animation-iteration-count: infinite;
	animation-duration: 20s;
	animation-name: rgb_anim;
}

/* RGB ANIMATION EFFECT */

@keyframes rgb_anim {
	from {
		filter: hue-rotate(0deg);
	}
	50% {
		filter: hue-rotate(360deg);
	}
	to {
		filter: hue-rotate(0deg);
	}
}

/* CSS */

* {
	margin: 0;
	padding: 0;
	color: white;
	font-family: "Montserrat";
	font-weight: 600;
	letter-spacing: 0.1em;
}

.content {
	min-height: 50vh;
	display: flex;
	flex-flow: column;
	justify-content: center;
	align-content: center;
	align-items: center;
	background: black;
}

.content:last-child {
	background: #de6161; /* fallback for old browsers */
	background: -webkit-linear-gradient(
		to right bottom,
		#2657eb,
		#de6161
	); /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(
		to right bottom,
		#2657eb,
		#de6161
	); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

a {
	text-decoration: none;
}

.btn {
	padding: 20px 45px;
	background: #5c258d; /* fallback for old browsers */
	background: -webkit-linear-gradient(
		to right bottom,
		#4389a2,
		#5c258d
	); /* Chrome 10-25, Safari 5.1-6 */
	background: linear-gradient(
		to right bottom,
		#4389a2,
		#5c258d
	); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
