#zoom {

  position: absolute;

  width: 100px;

  height: 100px;

  background-repeat: no-repeat;

  border-radius: 50px;

  box-shadow: 0 0 10px rgba(0, 0, 0, .8);

  display: none;

}



#wrapper {

  margin: 0 auto;

  width: 100%;

}





#content { text-align: center; }



#view {

  margin: 30px 0;

  height: 487px!important;

}



#view img {

  border-radius: 8px;

  box-shadow: 0 0 10px rgba(0,0,0,.6);

  width: 100%!important;

}



#thumbs {

  position: relative;

  margin: 20px 0;

}



#nav-left-thumbs { left: 70px; }



#nav-right-thumbs { right: 70px; }



#nav-left-thumbs, #nav-right-thumbs {

  position: absolute;

  top: 30px;

  width: 30px;

  height: 30px;

  line-height: 30px;

  border-radius: 15px;

  box-shadow: 0 0 10px rgba(0,0,0,.6);

  font-size: 1em;

  font-weight: bold;

  color: #999;

  text-shadow: 0 0 10px rgba(0,0,0,.5);

  cursor: pointer;

  transition-duration: .5s;

}



#nav-left-thumbs:hover, #nav-right-thumbs:hover { background: lightgrey; }



#pics-thumbs {

  position: relative;

  padding: 5px 0;

  margin: 0 10px;

  white-space: nowrap;

  overflow: hidden;

  transition-duration: .8s;

}



#pics-thumbs img {

  padding: 5px;

  margin: 0 2px;

  border-radius: 4px;

  box-shadow: 0 0 5px rgba(0,0,0,.6);

  cursor: pointer;

  height: 75px;

  transition-duration: .5s;

}



@media only screen and (max-width: 768px) {

  #view {

    margin: 30px 0;

    height: 157px!important;

}

}