.example-viewport {
     height: 500px;
     width: 100%;
     display: flex;
	 margin-left: auto;
	 margin-right: auto;
}
p {
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
h1 {
  text-align: center;
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
}
h2 
{
font-family:'Times New Roman', Times, serif;
}
button{
  background-color: #D87620;
  color: white;
  padding : 15px 25px;
  cursor: pointer;
}
#container{
  width:100%;
  }
#left{
  float:left;width:100px;
  }
#right{
  float:right;width:175px;
  }
#center{
  margin:0 auto;width:100px;
  }
.example-card {
  float: left;
  width: 100%;
  margin: 10px;
}
#edit {
  padding: 10px;
}
.edit:hover{
  border:solid;
}
#cart {
  padding: 10px;
}
#delete {
  padding: 10px;
}
.example-card:hover {
  border: solid;
}
#card-title {
  font-weight: bold;
  cursor: pointer;
  padding: 10px;
}
#imgContainer {
	padding:10px;
	text-align:center;
}
#ratingContainer {
	padding:10px;
}
#cardContainer {
	width: 35%;
	padding: 5%;
	float: left;
}