﻿        
.body1 {
  margin: 0 auto;
  width:765px;
  height:470px;
  position: relative;
}


.container {
  position: relative;
  border: rgba(0,0,0,0) solid 1px;
  margin: 0 auto;
  overflow: hidden;
}
.slider {
  transition: all 1s ease-in-out;
    -webkit-transition: all 1s ease-in-out; /** Chrome & Safari **/
    -moz-transition: all 1s ease-in-out; /** Firefox **/
    -o-transition: all 1s ease-in-out; /** Opera **/
}


.innerContainer {
  position: absolute;
}

.imageWrapper {
  width: 223px;
  height: 223px;
  padding: 6px;
  float: left;
  cursor: pointer;
  position: relative;
}

.image {
  width: 100%;
    height: auto;
    vertical-align: middle;
    border-width: 1px;
  border-style: solid;
  border-color: rgba(0,0,0,0);
  
}

.newline {
  clear:both;
}


.nav-right {
  background: url(images/right.png) no-repeat;
  background-position: center center;
  position: absolute;
  right: 0px;
  top: 235px;
  cursor: pointer;
  width: 40px;
}

.nav-left {
  background: url(images/left.png) no-repeat;
  background-position: center center;
  position: absolute;
  left: 0px;
  top: 235px;
  cursor: pointer;
  width: 40px;
}


.like, .comment {
  font-size: 14px;
  color: white;
  opacity: 0;
  position: absolute;
  display: block;
  bottom: 55px;
  left:8%;
  display: table;
}

.comment {
    bottom: 20px;
}


.like-img, .comment-img {
  transition: transform 0.2s ease-in-out;
    -webkit-transition: transform 0.2s ease-in-out; /** Chrome & Safari **/
    -moz-transition: transform 0.2s ease-in-out; /** Firefox **/
    -o-transition: transform 0.2s ease-in-out; /** Opera **/
}

.like span, .comment span {
     display:table-cell;
    vertical-align:middle;
}


.like-img:hover, .comment-img:hover {
  /*transform: scale(0.92,0.92);*/
  cursor: cell;
}
