#filters,
#filters li a {
    z-index: 15;
    position: relative
}

#filters,
#filters li,
#filters li a {
    position: relative
}

.item-caption,
.item-gradient {
    pointer-events: none;
    bottom: 0
}

#filters li a,
.item-title {
    font-family: Poppins, sans-serif;
    color: #fff
}

#filters {
    margin: 0 auto;
    text-align: center;
    height: auto;
    max-width: 1000px;
    width: 100%;
    overflow: hidden;
    padding: 0
}

#filters li {
    display: inline-block;
    height: 45px;
    line-height: 45px;
    margin: 20px 45px;
    opacity: 1
}

.item-content,
.item-content a,
.item-image,
.item-shadow,
.item-shadow img,
.item-tilt {
    height: 100%;
    width: 100%
}

#filters li a {
    display: inline-block;
    font-size: 24px;
    font-weight: 600;
    -webkit-transition: all .3s ease-in-out;
    -moz-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    -ms-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out
}

#filters:hover li a {
    opacity: .3
}

#filters li a:hover {
    color: #fff;
    opacity: 1
}

#filters li span {
    font-size: 12px;
    font-weight: 400;
    padding-left: 10px;
    position: absolute;
    top: -10px;
    color: #fff;
    opacity: .5
}

#portfolio,
#portfolio-wrap,
.item,
.item-content,
.item-tilt {
    position: relative
}

#portfolio-wrap {
    margin: 0 auto;
    padding-bottom: 140px
}

#portfolio {
    margin: 0 auto;
    -webkit-transition: height .3s ease-in-out;
    transition: height .3s ease-in-out
}

.portfolio:after {
    content: "";
    display: table;
    clear: both
}

.item,
.item-content a {
    display: block;
    box-sizing: border-box
}

.item {
    margin-bottom: 100px!important
}

.item:nth-child(3n+2) .item-content {
    margin-top: 100px
}

.item.item-margins:nth-child(3n+2) .item-content {
    margin-top: 0!important
}

.item-content {
    transition: all .15s linear 0s;
    -webkit-transition: all .15s linear 0s
}

.item.in-view:nth-child(3n+1) .item-content {
    transition: all .6s cubic-bezier(.215, .61, .355, 1) .1s;
    -webkit-transition: all .6s cubic-bezier(.215, .61, .355, 1) .1s
}

.item.in-view:nth-child(3n+2) .item-content {
    transition: all .6s cubic-bezier(.215, .61, .355, 1) .2s;
    -webkit-transition: all .6s cubic-bezier(.215, .61, .355, 1) .2s
}

.item.in-view:nth-child(3n+3) .item-content {
    transition: all .6s cubic-bezier(.215, .61, .355, 1) .3s;
    -webkit-transition: all .6s cubic-bezier(.215, .61, .355, 1) .3s
}

.item-shadow {
    position: absolute;
    left: 18%;
    top: 15%;
    -webkit-filter: blur(60px);
    filter: blur(60px);
    transform: scale(.7);
    -webkit-transform: scale(.8)
}

.item-content a {
    position: relative;
    overflow: hidden
}

.item-image {
    background-size: cover;
    background-position: center center;
    position: absolute;
    background-color: #333
}

item.in-view:nth-child(3n+1) a {
    animation: float-image 3s cubic-bezier(.215, .61, .355, 1) .7s;
    -webkit-animation: float-image 3s cubic-bezier(.215, .61, .355, 1) .7s
}

item.in-view:nth-child(3n+2) a {
    animation: float-image 3s cubic-bezier(.215, .61, .355, 1) .8s;
    -webkit-animation: float-image 3s cubic-bezier(.215, .61, .355, 1) .8s
}

item.in-view:nth-child(3n+3) a {
    animation: float-image 3s cubic-bezier(.215, .61, .355, 1) .9s;
    -webkit-animation: float-image 3s cubic-bezier(.215, .61, .355, 1) .9s
}

@-webkit-keyframes float-image {
    0%,
    100%,
    40% {
        -webkit-transform: translateY(0)
    }
    20% {
        -webkit-transform: translateY(4px)
    }
    75% {
        -webkit-transform: translateY(2px)
    }
}

@keyframes float-image {
    0%,
    100%,
    40% {
        transform: translateY(0)
    }
    20% {
        transform: translateY(4px)
    }
    75% {
        transform: translateY(2px)
    }
}

.item-gradient {
    width: 100%;
    height: 50%;
    position: absolute;
    left: 0;
    background: -moz-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .35) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .35) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, .35) 100%);
    filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000', GradientType=0)
}

.black-overlay .item-gradient,
.black-overlay .item:hover .item-gradient {
    height: 100%;
    background-image: linear-gradient(to right, #593dd5, #fc2b00)!important
}

.black-overlay .item-gradient {
    opacity: 0;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out
}

.black-overlay .item:hover .item-gradient {
    opacity: .8
}

.item-caption {
    width: 100%;
    padding: 20px;
    height: auto;
    box-sizing: border-box;
    text-align: center;
    position: absolute
}

.black-overlay .item-caption {
    padding: 170px 8px
}

.item-title {
    font-weight: 600;
    font-size: 24px;
    margin-left: -1px;
    margin-bottom: 0
}

.black-overlay .item-title {
    transform: translateY(20px);
    -webkit-transform: translateY(20px);
    opacity: 0;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out
}

.black-overlay .item:hover .item-title {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    opacity: 1;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out
}

.item:first-child .item-title::after {
    content: "";
    font-family: Roboto, sans-serif;
    font-size: 10px;
    position: absolute;
    font-weight: 400;
    margin-left: 8px;
    top: 14px;
    height: 10px;
    color: #FF1B0B
}

.item-case,
.item-cat {
    font-size: 12px;
    font-family: Roboto, sans-serif;
    line-height: 20px;
    color: rgba(255, 255, 255, .6);
    font-weight: 400;
    display: block
}

.black-overlay .item:first-child .item-title::after {
    top: -4px
}

.item-sub-mask {
    height: 20px;
    width: auto;
    margin-bottom: 5px;
    overflow: hidden;
    box-sizing: border-box
}

.item-cat {
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out
}

.black-overlay .item-cat {
    transform: translateY(20px);
    -webkit-transform: translateY(20px);
    opacity: 0;
    -webkit-transition: all .25s ease-in-out;
    transition: all .25s ease-in-out
}

.black-overlay .item:hover .item-cat {
    transform: translateY(0);
    -webkit-transform: translateY(0);
    opacity: 1;
    -webkit-transition: all .35s ease-in-out;
    transition: all .35s ease-in-out
}

.item-content:hover .item-cat {
    margin-top: -20px
}

.black-overlay .item-content:hover .item-cat {
    margin-top: 0
}

.isotope,
.isotope .isotope-item {
    -webkit-transition-duration: .8s;
    -moz-transition-duration: .8s;
    -ms-transition-duration: .8s;
    -o-transition-duration: .8s;
    transition-duration: .8s
}

.isotope {
    -webkit-transition-property: height, width;
    -moz-transition-property: height, width;
    -ms-transition-property: height, width;
    -o-transition-property: height, width;
    transition-property: height, width
}

.isotope .isotope-item {
    -webkit-transition-property: -webkit-transform, opacity;
    -moz-transition-property: -moz-transform, opacity;
    -ms-transition-property: -ms-transform, opacity;
    -o-transition-property: -o-transform, opacity;
    transition-property: transform, opacity
}

.isotope .isotope-item.no-transition,
.isotope.no-transition,
.isotope.no-transition .isotope-item {
    -webkit-transition-duration: 0s;
    -moz-transition-duration: 0s;
    -ms-transition-duration: 0s;
    -o-transition-duration: 0s;
    transition-duration: 0s
}

.next-project-info {
    font-size: 14px;
    font-family: Poppins, sans-serif;
    color: #000;
    position: absolute;
    top: 80px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    width: 100%;
    left: 0;
    visibility: visible;
    opacity: 1
}

.transition .next-project-info {
    -webkit-transition: opacity .2s ease-in-out 0s;
    transition: opacity .2s ease-in-out 0s;
    opacity: 0!important
}

.light-content .light-content .next-project-info {
    color: #fff
}

.transition .next-project-info.fade-in {
    -webkit-transition: opacity .2s ease-in-out 0s;
    transition: opacity .2s ease-in-out 0s
}

#project-nav {
    height: 100vh;
    width: 100%;
    transform: translateY(200px) scale(.9);
    -webkit-transform: translateY(200px) scale(.9);
    position: absolute;
    bottom: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s ease-in-out 0s;
    transition: all .3s ease-in-out 0s
}

#project-nav.fade-in {
    opacity: 1;
    transform: translateY(200px) scale(1);
    -webkit-transform: translateY(200px) scale(1);
    visibility: visible;
    -webkit-transition: all .4s ease-in-out .2s;
    transition: all .4s ease-in-out .2s
}

#project-nav .section-image {
    transform: translateX(0);
    -webkit-transform: translateX(0)
}

#share {
    display: block;
    margin-top: 30px
}

.jssocials-shares {
    display: table;
    margin: 0 auto!important
}

.jssocials-share {
    margin: 0 40px!important;
    position: relative
}

.jssocials-shares div:first-child {
    margin-left: 0!important
}

.jssocials-shares div:last-child {
    margin-right: 0!important
}

.jssocials-shares:hover .jssocials-share-link {
    opacity: .3
}

.jssocials-shares .jssocials-share-link:hover {
    color: #fff!important;
    opacity: 1
}

.jssocials-share-link {
    font-size: 24px;
    color: #fff;
    position: relative;
    height: 46p!important;
    width: 46px!important;
    text-align: center!important;
    line-height: 46px!important
}

@media only screen and (max-width:1466px) {
    .next-project-info {
        top: 60px
    }
}

@media only screen and (max-width:1024px) {
    #filters li {
        display: block
    }
    #portfolio-wrap {
        padding-bottom: 10px
    }
    .item-caption {
        padding-top: 15px;
        padding-left: 20px
    }
    .item-title {
        font-size: 20px;
        line-height: 30px
    }
    .item:nth-child(3n+2) .item-content {
        margin-top: 0
    }
	
	.item1:nth-child(3n+2) .item-content {
        margin-top: -180px;
    }
	
	.item1.in-view:nth-child(3n+3) .item-content {
    
    -webkit-transition: all .6s cubic-bezier(.215, .61, .355, 1) .3s;
    margin-top: -180px;
}
	
	
	
	
	
	.item1.in-view:nth-child(3n+1) .item-content {
    
    -webkit-transition: all .6s cubic-bezier(.215, .61, .355, 1) .1s;
    margin-top: -180px;
}
	
    #project-nav {
        transform: translateY(170px) scale(.9);
        -webkit-transform: translateY(180px) scale(.9)
    }
    #project-nav.fade-in {
        transform: translateY(170px) scale(1);
        -webkit-transform: translateY(170px) scale(1)
    }
    .next-project-info {
        top: 40px
    }
}

@media only screen and (max-width:767px) {
    .item-title {
        font-size: 18px
    }
    #project-nav {
        transform: translateY(170px) scale(.9);
        -webkit-transform: translateY(180px) scale(.9)
    }
    #project-nav.fade-in {
        transform: translateY(170px) scale(1);
        -webkit-transform: translateY(170px) scale(1)
    }
    .jssocials-share {
        margin: 0 20px!important
    }
}

@media only screen and (max-width:479px) {
    #portfolio-wrap {
        padding-bottom: 0
    }
    .item {
        margin-bottom: 60px!important
    }
    .item-title {
        font-size: 20px
    }
    #project-nav,
    #project-nav.fade-in {
        transform: translateY(170px) scale(1);
        -webkit-transform: translateY(170px) scale(1)
    }
}

.item-caption h2 {
    line-height: 34px!important
}