/* Portfolio */ 

    .portfolio ul{
        list-style: none;
        padding: 0;
    }
    
    .container.portfolio-title {
        padding-bottom:0px;
    }   

    #portfolio {
        padding-bottom: 0;
    }



/* Portfolio Filters */ 

    #filters {
        padding-top: 40px;
        padding-bottom: 30px;
        text-align: center;
        display: block;
        float: none;
        z-index: 2;
        position: relative;
    }
    
    #filters ul li {
        display: inline-block;
        margin:0 5px;
    }
    
    #filters ul li a {
        display: block; 
    }
    
     .filter-name{
        font-family: 'Raleway',sans-serif;
        font-size: 12px;
        font-weight: 300;
        letter-spacing: 2px;
        line-height: 19px;
        margin-bottom: 0;
        text-transform: uppercase;
        padding: 10px;
        transition:all 0.3s ease 0s;
        -moz-transition:all 0.3s ease 0s;
        -webkit-transition:all 0.3s ease 0s;
        -o-transition:all 0.3s ease 0s;
    }
   



/* Portfolio Items */   

    #portfolio-wrap {
        position: relative;
        padding: 0;
        width: 100%;
        margin: 0 auto;
        display: block;
    }
    
    #portfolio-wrap .one-four {
        margin: 0!important;
        line-height:0;
        width: 25%;
        padding: 0;
        position:relative;
    }
    
    .portfolio-item {
        padding: 0;
        position: relative;
        overflow: hidden;
    }
    .portfolio-item .portfolio-image {
        overflow: hidden;
        display: block;
        position: relative;
    }
    .portfolio-item .portfolio-image img {
        width: 100%;
        height: auto;
    }

    .portfolio-item:hover .project-overlay {
        opacity:1;
        transition:all 0.4s ease 0s;
        -moz-transition:all 0.4s ease 0s;
        -webkit-transition:all 0.4s ease 0s;
        -ms-transition:all 0.4s ease 0s;
        -o-transition:all 0.4s ease 0s;
    }

    .project-overlay {
        width:100%;
        height:100%;
        position:absolute;
        top:0;
        left:0;
        opacity:0;
        transition:all 0.3s ease 0s;
        -moz-transition:all 0.3s ease 0s;
        -webkit-transition:all 0.3s ease 0s;
        -o-transition:all 0.3s ease 0s;
        cursor:pointer;
    }
    
    .open-project-link {
        width:100%;
        height:100%;
        position:absolute;
        z-index:99;
    }

    .project-info {
        position:absolute;
        height:100px;
        width:100%;
        top:50%;
        margin-top:-50px;
        text-align:center;
    }
    
    .project-name {
        color:#fff;
        text-transform:uppercase;
        margin-top:50px;
        opacity:0;    
        font-family: 'Montserrat',sans-serif;
        font-size: 14px;
        font-weight: 400;
        letter-spacing: 3px;
        line-height: 24px;
        text-transform: uppercase;
        transition:all 0.2s ease 0s;
        -moz-transition:all 0.2s ease 0s;
        -webkit-transition:all 0.2s ease 0s;
        -ms-transition:all 0.2s ease 0s;
        -o-transition:all 0.2s ease 0s;
    }
    .portfolio-item:hover .project-name { 
        opacity:1;
        -webkit-transition: opacity .4s .5s;
        -moz-transition: opacity .4s .5s;
        -ms-transition: opacity .4s .5s;
        -o-transition: opacity .4s .5s;
        transition: opacity .3s .5s;
    }
    
    
    .project-categories{
        font-family: 'Raleway',sans-serif;
        font-size: 14px;
        font-weight: 300;
        line-height: 25px;
        opacity:0;
        margin-top:3px;
        transition:all 0.2s ease 0s;
        -moz-transition:all 0.2s ease 0s;
        -webkit-transition:all 0.2s ease 0s;
        -ms-transition:all 0.2s ease 0s;
        -o-transition:all 0.2s ease 0s;
        
    }
    
    .portfolio-item:hover .project-categories {
        opacity:1;
        -webkit-transition: opacity .4s .8s;
        -moz-transition: opacity .4s .8s;
        -ms-transition: opacity .4s .8s;
        -o-transition: opacity .3s .8s;
        transition: opacity .3s .8s;        
    }

    .zoom-icon {
        left: 50%;
        margin-left:-20px;
        position:inherit;
        width:40px;
        height:40px;
        margin-top:40px;
        opacity:0;
        background:url(../images/zoom.png);
        background-size:40px 40px;
        transition:all 0.3s ease 0.1s;
        -moz-transition:all 0.3s ease 0.2s;
        -webkit-transition:all 0.3s ease 0.2s;
        -ms-transition:all 0.3s ease 0.2s;
        -o-transition:all 0.3s ease 0.2s;   
    }
    
    .portfolio-item:hover .zoom-icon {
        opacity:1;
        margin-top:0px;
        -webkit-transition: opacity .3s .2s, margin-top .3s .2s;
        -moz-transition: opacity .3s .2s, margin-top .3s .2s;
        -ms-transition: opacity .3s .2s, margin-top .3s .2s;
        -o-transition: opacity .3s .2s, margin-top .3s .2s;
        transition: opacity .3s .2s, margin-top .3s .2s;
        
    }
    
    
    
    
/* Portfolio Isotope Transitions */ 

    .isotope, .isotope .isotope-item {
        -webkit-transition-duration: 0.8s;
        -moz-transition-duration: 0.8s;
        -ms-transition-duration: 0.8s;
        -o-transition-duration: 0.8s;
        transition-duration: 0.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.no-transition, .isotope.no-transition .isotope-item, .isotope .isotope-item.no-transition {
        -webkit-transition-duration: 0s;
        -moz-transition-duration: 0s;
        -ms-transition-duration: 0s;
        -o-transition-duration: 0s;
        transition-duration: 0s;
    }



/* Portfolio Expander */    



    #project-page-holder {      
        display: none;      
        background-color:#FFF;      
    }
    
    #project-page-button-fullscreen {   
        height: auto;       
        z-index:99;
        position: absolute;
        right:30px;
        top:15px;           
    }
    
    #project-page-button-fullscreen li {
        display:inline-block;
        font-size:30px;
    }
    
    #project-page-button-fullscreen li a {
        width:50px;
        height:50px;
        display:block;
        opacity:1;
    }
    
    #project-page-button-fullscreen li a:hover {
        opacity:1;
    }
    
    #project-page-button {
        text-align:center;      
        margin-bottom:20px;     
        height: auto;       
        position: relative;     
        z-index:99;        
    }
    
    #project-page-button li {
        display:inline-block;
        margin:60px 10px 0px 10px;
        font-size:30px;
    }

    #project-page-data {        
        margin-bottom: 0px;   
        padding-top: 30px;  
    }

    .project-section-title {
        text-align:center;
        margin-bottom:40px;
    }

    .project-section-title h1 {
        margin-bottom:5px!important;
    }       

    .project-page {
        background-color:#FFF;
        width:100%;
        height:auto;
        left:0;
        padding-bottom:40px;
    }

    
/* Portfolio Normal Expander Project Slider */  
    
    
    .project-image-slider .bx-wrapper .bx-next {
        background: url("../images/next-dark.png") no-repeat;
        background-size:50px 50px;
        opacity:0.3;
        right:-90px;
    }
    
    .project-image-slider .bx-wrapper .bx-prev {
        background: url("../images/prev-dark.png") no-repeat ;
        background-size:50px 50px;
        opacity:0.3;
        left:-90px;
    }
    
    .project-image-slider .bx-wrapper .bx-next:hover, .project-image-slider .bx-wrapper .bx-prev:hover {
        opacity:1;
        background-position:0
    }
    
    .project-image-slider .bx-wrapper .bx-controls-direction a {
        height: 50px;
        margin-top: -25px;
        outline: 0 none;
        position: absolute;
        text-indent: -9999px;
        top: 50%;
        width: 50px;
        z-index: 100;
    }
    
/* Portfolio Normal Expander */     
    
    .project-description {
        margin-top:40px;
        margin-bottom:20px;
        width:100%;
        height:auto;
    }
    
    .small-border {
        height:2px;
        width:50px;
        background-color:#ddd;
        margin-bottom:15px;
    }
    
    .visit-project {
        width:100%;
        text-align:center;
        border-top:1px solid #ddd;
        margin-top:20px;
        padding:55px 0 20px 0;
    }
    
    .project-description h5 {
        color:#222222;
        text-transform:uppercase;
        margin-bottom:5px;
    }
    
    
    
/* Portfolio FullScreen Expander */         
    
    #cycle-loader {
        height:32px;
        left:50%;
        margin:-8px 0 0 -8px;
        position:absolute;
        top:50%;
        width:32px;
        z-index:999;
    }

    #arrow_left {
        height:50px;
        position:absolute;
        left:30px;
        width:50px;
        z-index:1000;
        margin-top:5px;
    }
    
    #arrow_right {
        height:50px;
        position:absolute;
        left:90px;
        width:50px;
        z-index:1000;
        margin-top:5px;
    }
    
    #arrow_left:hover, #arrow_right:hover {
        margin-top:5px;
    }
    
    #arrow_left:active, #arrow_right:active {
        margin-top:5px;
    }   

    div.mc-image {
        -webkit-transition: opacity 1s ease-in-out; 
        -moz-transition: opacity 1s ease-in-out; 
        -o-transition: opacity 1s ease-in-out; 
        transition: opacity 1s ease-in-out;
        -webkit-background-size: cover;
        -moz-background-size: cover;
        -o-background-size: cover;
        background-size: cover;
        background-position:center center;
        background-repeat:no-repeat;
        height:100%;
        overflow:hidden;
        width:100%;
    }




/* Project External */  

    #project-header {
        height:600px;
        z-index:1;
    }
    
    #project-header .container {
        height:inherit;
    }
    
    .table-header {
        display:table;
        position:relative;
        height:inherit;
        width:100%;
    }
    
    .table-left {
        width:50%;
        left:0;
        position:absolute;
        bottom:0;
    }
    
    .table-right {
        width:50%;
        text-align:left;
        position:relative;
        right:0;
        display:table-cell;
        vertical-align:middle
    }
    
    .table-header h2 {
        margin-bottom:25px;
    }
    
    .table-header p{
        margin-bottom:35px;
    }   
    
    #project-url {
        height:40px;
        background-color:#222222;
        text-align:center;
        position:relative;
        z-index:10;
    }
    
    #project-url .site a {
        color: #FFFFFF;
        display: block;
        font-family: Georgia;
        font-size: 13px;
        height: 40px;
        letter-spacing: 1px;
        line-height: 40px;
        overflow: hidden;
    }
    
    #project-url .site .group {
        display: block;
        width: 100%;
    }
    
    #project-url .site .group span {
        display: block;
        height: 40px;
        transition:all 0.3s ease 0s;
        -moz-transition:all 0.3s ease 0s;
        -webkit-transition:all 0.3s ease 0s;
        -o-transition:all 0.3s ease 0s;
    }
    
    #project-url .site:hover .text {
        display: block;
        margin-top:-40px;   
    }
    
    #project-url .site:hover .hover {
        display: block;
    }
    
    #project-info .section-title {
        margin-bottom:0;
    }
    
    #project-features {
        background-color:#fff;
    }
    
    #project-slider .container{
        padding-bottom:60px;
    }
    
    #project-slider .bx-wrapper {
        margin-bottom:60px!important;
    }
    
    #project-options {
        background:#fff;
    }
    
    #project-options h2 {
        margin:40px 0;
    }
    
    #project-options ul {
        margin-bottom:40px;
    }
    
    #project-options ul li {
        line-height:24px;
    }
    
    #project-counters {
        background-color:#222;
    }

    #project-counters .counters {
        margin-top:20px;
        width:1120px;
        margin:0 auto;
    }
    
    #project-counters .counters li {
        background: none ;
        border-radius: 3px 3px 3px 3px;
        color: rgba(255,255,255,0.5);
        font-family: 'Open Sans', serif;
        font-size: 14px;
        padding: 25px 0;
        text-align: center;
        text-transform: none;
    }
    
    #project-counters .counters li .count {
        border-radius: 3px 3px 3px 3px;
        color: #fff;
        font-family: 'Montserrat',sans-serif;
        font-size: 70px;
        padding: 25px 0;
        text-align: center;
        text-transform: uppercase;
        display:block;
    }


.video-container {
    height: 0;
    margin-bottom: 30px;
    overflow: hidden;
    padding-bottom: 56.25%;
    padding-top: 10px;
    position: relative;
}
.video-container iframe, .video-container object, .video-container embed {
    border: 0 none;
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 100%;
}
hr {
    background-color: #E9E9E9;
    border: medium none !important;
    float: left;
    height: 1px;
    margin: 60px 0;
    width: 100%;
}

.project-description{
    margin-bottom: 60px;
}
.controls-wrap{
    padding: 10px;
    position: absolute;
    width: 100%;
    min-height: 80px;
    z-index: 99;
}