@import url(http://fonts.googleapis.com/css?family=Bree+Serif);

body {
  padding: 0;
  margin: 4em 0 0;
  text-align: center;
  color: #484848;
  text-shadow: 1px 1px 0px rgba(255,255,255,.4);
  background: url('images/background.png') top left;
}

h1, em, #information {
  display: block;
  font-size: 40px;
  font-weight: normal;
  font-family: "Bree Serif";
  margin: 0 auto;
}

em {
  margin-bottom: 0.5em;
}

a {
  color: #484848;
  font-style: normal;
  text-decoration: none;
  font-size: 20px;
}

a:hover {
  text-decoration: underline;
}

#container {
  display: block;
  margin: 0 auto;
}
  
  #item-receiver {
    display: block;
    text-align: left;
    margin-bottom: 7em;
  }
  
    #item-receiver img {
      display: inline-block;
      margin: 0 0 2em 2em;
      width: 205px;
      box-shadow: 5px 9px 5px rgba(0,0,0,.3);
    }
    
      .show {
        -webkit-animation: show 0.5s ease-in;
	        -moz-animation: show 0.5s ease-in;
	         -ms-animation: show 0.5s ease-in;
	          -o-animation: show 0.5s ease-in;
	             animation: show 0.5s ease-in;
      }

#arrow {
	position: fixed;
	bottom: 2.5em;
	left: 6em;
}
  
#thumbnail-wrapper {
  position: fixed;
  bottom: 0;
  left: 0;
  height: 90px;
  background: #f1f1f1;
  text-align: left;
  padding: 10px 15px;
  box-shadow: 0px 0px 10px #ccc;
  width: 60px;
}

  #plus {
    float: left;
    margin-top: 1em;
    cursor: pointer;
    -webkit-transition: .2s ease-in-out;
       -moz-transition: .2s ease-in-out;
        -ms-transition: .2s ease-in-out;
         -o-transition: .2s ease-in-out;
            transition: .2s ease-in-out;
  }
  
    .clicked {
      -webkit-transform: rotate(45deg);
         -moz-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
           -o-transform: rotate(45deg);
              transform: rotate(45deg);
    }

  .item-list {
    list-style-type: none;
    margin: 0;
    padding: 0;
    display: none;
  }
  
    .item-list li {
      display: inline-block;
      margin-left: 1em;
    }
    
      .item {
        cursor: pointer;
        -webkit-transition: .2s ease-in-out;
           -moz-transition: .2s ease-in-out;
            -ms-transition: .2s ease-in-out;
             -o-transition: .2s ease-in-out;
                transition: .2s ease-in-out;
      }
      
        .item:hover {
          box-shadow: 0 0 10px #aaa;
          -webkit-transform: scale(1.02);
             -moz-transform: scale(1.02);
              -ms-transform: scale(1.02);
               -o-transform: scale(1.02);
                  transform: scale(1.02);
        }
  
		
@-webkit-keyframes show{
  0% { 
    -webkit-transform: scale(1.2); 
            transform: scale(1.2); 
  }
  
  50% { 
    -webkit-transform: scale(0.9); 
            transform: scale(0.9); 
  }
  
  75% { 
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  
  100% { 
    -webkit-transform: scale(1);
            transform: scale(1);
  }
} 
  
		
@-moz-keyframes show{
  0% { 
    -moz-transform: scale(1.2); 
         transform: scale(1.2); 
  }
  
  50% { 
    -moz-transform: scale(0.9); 
         transform: scale(0.9); 
  }
  
  75% { 
    -moz-transform: scale(1.1);
         transform: scale(1.1);
  }
  
  100% { 
    -moz-transform: scale(1);
         transform: scale(1);
  }
}  
  
		
@-ms-keyframes show{
  0% { 
    -ms-transform: scale(1.2); 
        transform: scale(1.2); 
  }
  
  50% { 
    -ms-transform: scale(0.9); 
        transform: scale(0.9); 
  }
  
  75% { 
    -ms-transform: scale(1.1);
        transform: scale(1.1);
  }
  
  100% { 
    -ms-transform: scale(1);
        transform: scale(1);
  }
}   
  
		
@-o-keyframes show{
  0% { 
    -o-transform: scale(1.2); 
       transform: scale(1.2); 
  }
  
  50% { 
    -o-transform: scale(0.9); 
       transform: scale(0.9); 
  }
  
  75% { 
    -o-transform: scale(1.1);
       transform: scale(1.1);
  }
  
  100% { 
    -o-transform: scale(1);
       transform: scale(1);
  }
} 
  
		
@keyframes show{
  0% { 
    transform: scale(1.2); 
  }
  
  50% {  
    transform: scale(0.9); 
  }
  
  75% {  
    transform: scale(1.1); 
  }
  
  100% {  
    transform: scale(1); 
  }
} 