body {background-color: violet;}

div {
	background-color: purple; 
	opacity: 0.5;	
}

div {
	background-color: purple; 
	opacity: 0.5;	
}

img {
  border: 1px solid #ddd;
  border-radius: 4px;
  padding: 5px;
  width: 300px;
}
img:hover {
  box-shadow: 0 0 2px 1px rgba(0, 140, 186, 0.5);
}
div {
	background-color: violet; 
	opacity: 0.5;	
}

div {
	background-color: purple; 
	opacity: 0.5;	
}

.dot {
  height: 20px;
  width: 20px;
  background-color: #bbb;
  border-radius: 60%;
  display: inline-block;
}
/* unvisited link */
a:link {
  color: blue;
}

/* visited link */
a:visited {
  color: gray;
}

/* mouse over link */
a:hover {
  color: yellow;
}

/* selected link */
a:active {
  color: red;
}

/*For the navigational bar ---> found at W3schools.com*/

ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

li {
  float: left;
}

li a {
  display: block;
  padding: 8px;
  background-color: #d8d6ff;
}

/*For DIV Floats*/

div.left {
	border-top-style: dashed;
	border-right-style: dashed;
	border-bottom-style: dashed;
	border-left-style: dashed;
	width: 485px; 
	height: 350px;
} 

.left {width: 500px;
float: left;
background-color: #c9dfca;
}

div.right {
	border-top-style: solid;
	border-right-style: solid;
	border-bottom-style: solid;
	border-left-style: solid;
	width: 485px; 
	height: 350px;
} 

.right {width: 500px;
float: left;
background-color: #ffc0cb;
}

.footer {clear: both;
width: 1000px;
background-color: #E6E6FA;
}