.title {
  text-align: center;
  color: #333;
  font-size: 1.6em;
}
.creds {
  text-align: center;
  color: #666;
  font-size: 0.85em;
}
.creds a {
  color: #000;
  text-decoration: none;
  border-bottom: 1px dotted #000;
}
.flip-menu{
/*margin:0;*/
}
.flip-item-wrap{
/*width: 20%;*/
height: auto;
float: left;
position:relative;
-webkit-perspective:800px;
    -ms-perspective:800px;
     -o-perspective:800px;
        perspective:800px;
}
.flip-item-wrap.lrg{width:33.3%}

/*@media screen and (min-width: 1280px) {
    .flip-item-wrap{
    width: 25%;
    }
}
@media screen and (max-width: 979px) {
    .flip-item-wrap{
    width: 33.3%;
    }
}*/
@media screen and (max-width: 639px) {
    .flip-item-wrap{
    width: 50%;
    }
}
@media screen and (max-width: 379px) {
    .flip-item-wrap{
    width: 100%;
    }
}
.flip-item-wrap img{
width:100%;
height:auto;
display:block;
margin:0;
}
.flip-item-wrap input{
display: none;
}
.flip-item-wrap .fake-image{
visibility: hidden;
}
.flip-item{
display: block;
width:100%;
height:100%;
float:left;
position:absolute;
top:0;
left:0;
cursor:pointer;
color:#fff;
-webkit-transform-style:preserve-3d;
        transform-style:preserve-3d;
-webkit-transition:-webkit-transform 1s;
        transition: -webkit-transform 1s;
        transition: transform 1s;
        transition:        transform 1s, -webkit-transform 1s;
}
.flip-item figure{
display:block;
position:absolute;
width:100%;
/*height:100%;*/
margin:0;
-webkit-backface-visibility:hidden;
        backface-visibility:hidden;
}
.flip-item .back{
width:100%;
display:block;
margin:0;
-webkit-transform:rotateY( 180deg );
        transform:rotateY( 180deg );
}
.flipper:checked + .flip-item{
-webkit-transform:rotateY( 180deg );
        transform:rotateY( 180deg );
}
.flip-item-desc{
background: rgba(0,0,0,0.2);
width:90%;
height:90%;
padding:5%;
position:absolute;
top: 0;
left: 0;
text-shadow:1px 2px 1px rgba(0,0,0,0.9);
overflow:hidden;
}
.flip-item-title{
font-size: 1.5em;
margin: 1em 0 0.8em;
}