body {
	height: 2000px;
}

#default-div {
	background-color: blue;
  color: white;
}

/* static */
#static-div {
	background-color: green;
  color: white;
  position: static;
}

/* relative */
#relative-div {
	background-color: red;
  color: white;
  position: relative;
  left: 20px;
  top: 15px;
}

/* absolute */
#absolute-div {
	background-color: purple;
  color: white;
  position: absolute;
  top: 5px;
}
#container-div {
	background-color: yellow;
  position: relative;
}

/* fixed */
#fixed-div {
	background-color: cyan;
  position: fixed;
  left: 20px;
  top: 150px;
}

/* sticky */
#sticky-div {
	background-color: magenta;
  position: sticky;
  top: 0;
}

/* float */
.example-div {
	padding: 20px;
  margin: 5px;
}
#parent-div {
	width: 500px;
  background-color: lightpink;
}
#box1 {
	width: 70px;
  background-color: lightblue;
  float: left;
}
#box2 {
	width: 70px;
  background-color: wheat;
  float: right;
}
#box3 {
	width: 70px;
  background-color: plum;
  float: right;
}
#gradient {
	background-image: radial-gradient(circle, #6A4D25, #0B5066);
  padding: 3%;
  color: white;
  font-size: 3em;
}
#gradient-text{
	background-image: radial-gradient(circle, #6A4D25, #0B5066);
  background-clip: text;
  -webkit-background-clip: text;
  color: transparent;
  font-size: 3em;
}