style.css

/*
 * Simple item filter in JavaScript
 * author: Jakub Vojvoda, vojvoda@swdeveloper.sk
 * 2015
 * 
 * file: style.css 
 * 
 */

/* font style */
* {
  font-family: Arial, Helvetica, sans-serif;
}

/* style of list items */
.item {  
  display: inline-block;
  width: 450px;
  
  margin-bottom: 10px;
  margin-right: 5px;
  
  padding: 10px 10px 10px 10px;
  
  border-style: solid;
  border-width: 1px;
  border-color: #FAFAFA;
  
  background-color: #F8F8F8;
}

/* list item image */
.item img { 
  float: left;
}

/* list item description */
.item .title, .item .author, .item .genre {
  display: block;
  
  margin-left: 130px;
}

/* name of item */
.item .title {
  color: #055A85;
}

/* item author */
.item .author {
  margin-top: -20px;
}

/* author link style */
.item .author a {
  font-weight: bold;
  text-decoration: none;
  color: #616161;
}

/* author link style */
.item .author a:hover {
  text-decoration: none;
  color: black;
}

/* genre style */
.item .genre {  
  margin-top: 10px;
  
  color: #111111;
}

/* button style */
.item .buy-button {
  display: block;
  float: right;
  
  margin-top: 32px;
  padding: 10px;
  
  font-weight: bold;
  
  border-style: solid;
  border-width: 1px;
  border-color: white;
  
  background-color: #C3DAE6;
  
  font-size: 108%;
  text-decoration: none;
  color: black;
}

/* button style */
.item .buy-button:hover {  
  border-color: #055A85;
  color: black;
}

/* button description */
.item .buy {
  display: block;
  float: right;
  
  padding-right: 12px;
  
  color: #055A85;
}

/* cost of item */
.item .price {
  display: block;
  float: right;
  
  color: black;
}