section#main{

    position: relative;

    z-index: 2;

}



section#main .container{

    padding-bottom: 20px;

}

section#main .filter{

    font-size: 0;

    text-align: right;
	
	display: none;

}

section#main .filter > label{

    display: inline-block;

    font-size: 15px;

    font-family: 'HelveticaNeue65';

    text-align: left;

    vertical-align: middle;

}

section#main .filter .select{

    position: relative;

    display: inline-block;

    margin-left: 10px;

    vertical-align: middle;

    background: #fff;

}



section#main .filter label{

    cursor: pointer;

}

section#main .filter .options{
    position: absolute;
    top: 100%;
    left: 0;
    height: 0;
    font-family: Helvetica, Arial;
    font-size: 15px;
    padding: 0 10px;
    overflow: hidden;
    visibility: hidden;
    -webkit-transition: height 0.25s ease-out, padding 0.25s ease-out, visibility 0.25s ease-out 0.25s;
       -moz-transition: height 0.25s ease-out, padding 0.25s ease-out, visibility 0.25s ease-out 0.25s;
         -o-transition: height 0.25s ease-out, padding 0.25s ease-out, visibility 0.25s ease-out 0.25s;
            transition: height 0.25s ease-out, padding 0.25s ease-out, visibility 0.25s ease-out 0.25s;
}

section#main .filter .select.active{

    z-index: 1;

}

section#main .filter .select.active .options{

    visibility: visible;

    padding: 10px;

    min-width: 100%;

    background: #fff;

    -webkit-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.25);

       -moz-box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.25);

            box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.25);

    -webkit-transition: all 0.25s ease-out;

       -moz-transition: all 0.25s ease-out;

         -o-transition: all 0.25s ease-out;

            transition: all 0.25s ease-out;

}

section#main .filter .options span{

    display: block;

}

section#main .filter .option{

    position: relative;

    border: solid 1px #717171;

    background: #e3e3e3;

    height: 22px;

    line-height: 20px;

    margin-bottom: 4px;

    font-size: 15px;

    text-align: left;

    padding:  0 5px;

    opacity: 0;

    cursor: pointer;

}

section#main .filter .option:last-child{

    margin: 0;

}

section#main .filter .select.active .option{

    opacity: 1;

    -webkit-transition: all 0.25s ease-out 0.25s;

       -moz-transition: all 0.25s ease-out 0.25s;

         -o-transition: all 0.25s ease-out 0.25s;

            transition: all 0.25s ease-out 0.25s;

}

section#main .filter .select.active .option.checked:after{

    content: '';

    display: block;

    position: absolute;

    width: 20px;

    height: 20px;

    right: 1px;

    top: 1px;

    background: url('../img/tick.png') no-repeat center;

}





section#gallery .container{

    padding-top: 0;

}

section#gallery .gallery{

    min-height: 200px;

    margin: 0 -10px;

    -webkit-transition: opacity 0.25s ease-out 0.25s;

       -moz-transition: opacity 0.25s ease-out 0.25s;

         -o-transition: opacity 0.25s ease-out 0.25s;

            transition: opacity 0.25s ease-out 0.25s;

}

section#gallery .gallery.hide{

    opacity: 0;

    -webkit-transition: none;

       -moz-transition: none;

         -o-transition: none;

            transition: none;

}

section#gallery .photo{

    float: left;

    width: 33.333333%;

    padding: 0 10px;

    cursor: pointer;

    margin-bottom: 20px;

}

section#gallery .photo .img{

    padding-bottom: 100%;

}

section#gallery .photo .img:after{

    content: '';

    display: block;

    position: absolute;

    left: 0;

    top: 0;

    width: 100%;

    height: 100%;

    opacity: 0;

    background: #000;

    z-index: 1;

    -webkit-transition: all 0.25s ease-out;

       -moz-transition: all 0.25s ease-out;

         -o-transition: all 0.25s ease-out;

            transition: all 0.25s ease-out;

}

section#gallery .photo:hover .img:after{

    opacity: 0.5;

}







@media (max-width: 1200px){

    section#gallery .photo{

        width: 50%;

    }

}





@media (max-width: 600px){

    section#gallery .photo{

        width: 100%;

    }

}



@media (max-width: 400px){

    section#main .filter{

        text-align: left;

    }

    section#main .filter label{

        display: block;

        margin-bottom: 5px;

    }

    section#main .filter .select{

        margin: 0 10px 0 0;

    }

}