#gallery-container{font-size:14px;margin:auto;position:relative;max-width:50em;text-align:center;overflow:hidden;padding-top:1em}

#gallery-container:full-screen{max-width:100% !important;width:100%;height:100% !important;background-color:#fff}

#gallery-container:-webkit-full-screen{max-width:100% !important;width:100%;height:100% !important;background-color:#fff}

#gallery-container:-moz-full-screen{max-width:100% !important;width:100%;height:100% !important;background-color:#fff}

.controls{text-align:center;font-size:1em;opacity:0;pointer-events:none;-webkit-transition:opacity .3s ease;transition:opacity .3s ease;position:absolute;bottom:0;left:0;right:0}

.control,.grid,.fs-toggle{width:.66em;height:.66em;text-align:center;line-height:.5em;cursor:pointer;display:inline-block;margin-right:10px}

.fs-toggle{display:none}

.showControls{opacity:1;pointer-events:auto;-webkit-transition:opacity .6s 1s ease;transition:opacity .6s 1s ease}

.hideControls{opacity:0;pointer-events:none}

.icon-grid,.icon-arrow-left,.icon-arrow-right,.icon-fullscreen-exit,.icon-fullscreen{display:inline-block;width:20px;height:20px;background-repeat:no-repeat}

.icon-grid{background-position:0 0}

.icon-arrow-left{background-position:-40px 0}

.icon-arrow-right{background-position:-80px 0}

.icon-fullscreen-exit{background-position:-120px 0}

.icon-fullscreen{background-position:-160px 0}

.item{display:inline-block;cursor:pointer;width:32%;height:auto;margin-right:.5%;vertical-align:top;min-height:200px}

.item img,.item--big img{width:100%}

.items--big{position:absolute;top:0;left:0;right:0;width:100%;height:100%;pointer-events:none}

.item--big{position:absolute;width:60%;height:auto;left:20%;right:20%;top:3em;opacity:0;-webkit-transform:scale(.8);transform:scale(.8)}

.fadeInScaleUp{-webkit-animation:fadeInScaleUp .5s ease-out .6s forwards;animation:fadeInScaleUp .5s ease-out .6s forwards;z-index:3}

.fadeOut{-webkit-animation:fadeOut .4s ease-out forwards;animation:fadeOut .4s ease-out forwards;z-index:1}

@keyframes fadeOut{from{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

to{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

}
@-webkit-keyframes fadeOut{from{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

to{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

}
@keyframes fadeInScaleUp{from{opacity:0;-webkit-transform:scale(.8);transform:scale(.8)}

to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

}
@-webkit-keyframes fadeInScaleUp{from{opacity:0;-webkit-transform:scale(.8);transform:scale(.8)}

to{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

}
.scaleDownFadeOut{-webkit-animation:scaleDownFadeOut .4s ease-in forwards;animation:scaleDownFadeOut .4s ease-in forwards;pointer-events:none}

@keyframes scaleDownFadeOut{0{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

99%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}

100%{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

}
@-webkit-keyframes scaleDownFadeOut{0{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

99%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}

100%{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

}
.scaleUpFadeIn{opacity:0;-webkit-transform:scale(1);transform:scale(1);-webkit-animation:scaleUpFadeIn ease-in-out .4s forwards;animation:scaleUpFadeIn ease-in-out .4s forwards;-webkit-animation-duration:.4s;animation-duration:.4s}

@keyframes scaleUpFadeIn{0{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

1%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}

100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

}
@-webkit-keyframes scaleUpFadeIn{0{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

1%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}

100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

}
.showLastSecond{opacity:0;-webkit-transform:scale(1);transform:scale(1);-webkit-animation:showLastSecond ease-in-out .4s forwards;animation:showLastSecond ease-in-out .4s forwards;-webkit-animation-duration:.4s;animation-duration:.4s}

@keyframes showLastSecond{0{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

1%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}

99%{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

}
@-webkit-keyframes showLastSecond{0{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

1%{opacity:0;-webkit-transform:scale(.5);transform:scale(.5)}

99%{opacity:0;-webkit-transform:scale(1);transform:scale(1)}

100%{opacity:1;-webkit-transform:scale(1);transform:scale(1)}

}
@media screen and (max-width:30em){.item--big{width:80%;right:10%;left:10%}

}