/* line 1, ../sass/demo.scss */
html, body {
  font-family: 'Slabo 27px', serif;
  padding: 0;
  margin: 0;
  background: #ffffff;
}

/* line 8, ../sass/demo.scss */
* {
  box-sizing: border-box;
}

/* line 12, ../sass/demo.scss */
a {
  color: #4ab19a;
}

/* line 16, ../sass/demo.scss */
.clear {
  clear: both;
  float: none;
  width: 100%;
}

/* line 22, ../sass/demo.scss */
.container {
  max-width: 1170px;
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
/* line 32, ../sass/demo.scss */
.container .gallery a img {
  float: left;
  width: 23%;
  height: auto;
  height: 200px;
  border: 2px solid #fff;
  -webkit-transition: -webkit-transform .15s ease;
  -moz-transition: -moz-transform .15s ease;
  -o-transition: -o-transform .15s ease;
  -ms-transition: -ms-transform .15s ease;
  transition: transform .15s ease;
  position: relative;
  margin:10px;
  box-shadow: 0 0 10px 0 rgba(0,0,0, 0.3);
}
/* line 46, ../sass/demo.scss */
.container .gallery a:hover img {
  -webkit-transform: scale(1.05);
  -moz-transform: scale(1.05);
  -o-transform: scale(1.05);
  -ms-transform: scale(1.05);
  transform: scale(1.05);
  z-index: 5;
}
/* line 57, ../sass/demo.scss */
.container .gallery a.big img {
  width: 40%;
}

/* line 65, ../sass/demo.scss */
.align-center {
  text-align: center;
}

@media screen and (min-width:992px) and (max-width:1440px)
{
.container .gallery a img
{
    width: 22.8%;
}
}
@media screen and (min-width:768px) and (max-width:991px)
{
.container .gallery a img
{
    width: 30.5%;
}
}
@media screen and (min-width:600px) and (max-width:767px)
{
.container .gallery a img
{
    width: 46.2%;
}
}
@media screen and (max-width:599px)
{
.container .gallery a img
{
    width: 96%;
}
}