@charset "utf-8"; /* CSS Document */
.filterize {
    float: right;
    width: 100%;
}

/* --------------------------
	Navigation
----------------------------- */
.filetring_nav {
    float: right;
    width: 100%;
    /*margin:0 0 25px 0;*/
    background: rgba(255, 255, 255, 0.8);
    padding: 15px 0;
}

.filetring_nav ul {
    float: right;
    width: 100%;
    text-align: center;
}

.filetring_nav ul li {
    display: inline;
    cursor: pointer;
    color: #0d4b92;
    transition: 0.3s;
    -webkit-transition: 0.3s;
    -moz-transition: 0.3s;
    -o-transition: 0.3s;
    -ms-transition: 0.3s;
    padding: 5px 0px;
    margin: 0 7px;
    /*border-bottom:2px solid #FFF;*/
}

.filetring_nav ul li:hover {
    color: #4d4d4d;
    /*border-bottom:2px solid #999999;*/
}

.current-li {
    color: #4d4d4d !important;
    /*border-bottom:2px solid #999999 !important;*/
}

/*.filetring_nav ul li:hover:after 		{}
.filetring_nav ul li:after 				{margin-left:10px; content:'|';}
.filetring_nav ul li:last-child:after	{content:'';}*/
/* --------------------------
	Main Image Box
----------------------------- */
.work {
    float: right;
    width: 100%;
}

.work figure {
    float: right;
    width: 33.33333333333333%;
    background: #0d4b92;
    position: relative;
    transition: 0.6s;
    -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -o-transition: 0.6s;
    -ms-transition: 0.6s;
    margin: 0;
    padding: 0;
}

.work figure img {
    height: 100%;
    width: 100%;
    display: block;
}

.work figure div {
    opacity: 0;
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    padding: 12% 10%;
    background: rgba(51, 51, 51, 0.9);
    color: white;
    transition: 0.6s;
    -webkit-transition: 0.6s;
    -moz-transition: 0.6s;
    -o-transition: 0.6s;
    -ms-transition: 0.6s;
    text-align: center;
}

.work figure:hover div {
    opacity: 1;
}

.work figure div h5 {
    padding: 0 0 25px 0;
    font-weight: bold;
}

.work figure div p {
    font-size: 13px;
}

.work figure div .work_view {
    margin: 35px 0 0 0;
}

.work figure div .work_view a {
    padding: 10px 10px;
    color: #FFF;
    border-bottom: 2px solid #0d4b92;
    border-top: 2px solid #0d4b92;
    font-size: 16px;
    font-weight: bold;
}

.work figure div .work_view a:hover {
    color: #FFF;
    border-bottom: 2px solid #FFF;
    border-top: 2px solid #FFF;
}

.current {
    -webkit-transform: scale(1.01);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-backface-visibility: hidden;
    -moz-backface-visibility: hidden;
    -o-backface-visibility: hidden;
    -ms-backface-visibility: hidden;
    backface-visibility: hidden;
}

.not-current {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -webkit-filter: grayscale(1) !important;
    /*opacity:0.6;*/
    display: none;
}

.not-current:hover div {
    opacity: 0 !important;
}

/*===================================================================================================
3	) Mobile
===================================================================================================*/
/* Note:Design for a width of 320px */
@media only screen and (max-width: 599px) {
    .filetring_nav ul li {
        float:right;
        width: auto;
        padding: 5px 5%;
        display: inherit;
        margin: 0;
    }

    .filetring_nav ul li:first-child {
        margin-left: 0;
    }

    .filetring_nav ul li:last-child {
        margin-right: 0;
    }

    .work figure {
        width: 100%;
        margin-bottom: 1px;
    }

    .work figure:last-child {
        margin-bottom: 0;
    }
}
