/* Slider */
.slick-slider{
    position:relative;
    display:block;
    box-sizing:border-box;
    -webkit-user-select:none;
    -moz-user-select:none;
    -ms-user-select:none;
    user-select:none;
    -webkit-touch-callout:none;
    -khtml-user-select:none;
    -ms-touch-action:pan-y;
    touch-action:pan-y;
    -webkit-tap-highlight-color:transparent;
    direction:ltr;
}
.slick-list{
    position:relative;
    display:block;
    overflow:hidden;
    margin:0;
    padding:0
}
.slick-list:focus{
    outline:none
}
.slick-list.dragging{
    cursor:pointer;
    cursor:hand
}
.slick-slider .slick-track,.slick-slider .slick-list{
    -webkit-transform:translate3d(0,0,0);
    -moz-transform:translate3d(0,0,0);
    -ms-transform:translate3d(0,0,0);
    -o-transform:translate3d(0,0,0);
    transform:translate3d(0,0,0)
}
.slick-track{
    position:relative;
    top:0;
    right:0;
    display:block
}
.slick-track:before,.slick-track:after{
    display:table;
    content:''
}
.slick-track:after{
    clear:both
}
.slick-loading .slick-track{
    visibility:hidden
}
.slick-slide{
    display:none;
    float:right;
    height:100%;
    min-height:1px
}
[dir='rtl'] .slick-slide{
    float:left
}
.slick-slide img{
    display:block
}
.slick-slide.slick-loading img{
    display:none
}
.slick-slide.dragging img{
    pointer-events:none
}
.slick-initialized .slick-slide{
    display:block
}
.slick-loading .slick-slide{
    visibility:hidden
}
.slick-vertical .slick-slide{
    display:block;
    height:auto;
    border:1px solid transparent
}
.slick-arrow.slick-hidden{
    display:none
}
/* basic scrollbar styling */
/* vertical scrollbar */
.mCustomScrollBox{
    overflow:hidden
}
.mCSB_container{
    width:auto;
    overflow:hidden
}
.mCSB_container.mCS_no_scrollbar{
    margin-left:0
}
.mCS_disabled>.mCustomScrollBox>.mCSB_container.mCS_no_scrollbar,.mCS_destroyed>.mCustomScrollBox>.mCSB_container.mCS_no_scrollbar{
    margin-left:0
}
.mCustomScrollBox>.mCSB_scrollTools{
    width:16px;
    height:100%;
    top:0;
    left:0
}
.mCSB_scrollTools .mCSB_draggerContainer{
    position:absolute;
    top:0;
    right:auto;
    bottom:0;
    left:0;
    height:auto
}
.mCSB_scrollTools a+.mCSB_draggerContainer{
    margin:20px 0
}
.mCSB_scrollTools .mCSB_draggerRail{
    width:4px;
    height:100%;
    margin:0 auto;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px
}
.mCSB_scrollTools .mCSB_dragger{
    cursor:pointer;
    width:100%;
    height:30px
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:4px;
    height:100%;
    margin:0 auto;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px;
    text-align:center
}
.mCSB_scrollTools .mCSB_buttonUp,.mCSB_scrollTools .mCSB_buttonDown{
    display:block;
    position:relative;
    height:20px;
    overflow:hidden;
    margin:0 auto;
    cursor:pointer
}
.mCSB_scrollTools .mCSB_buttonDown{
    top:100%;
    margin-top:-40px
}
/* horizontal scrollbar */
.mCSB_horizontal>.mCSB_container{
    height:auto;
    margin-left:0;
    margin-bottom:30px;
    overflow:hidden
}
.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar{
    margin-bottom:0
}
.mCS_disabled>.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar,.mCS_destroyed>.mCSB_horizontal>.mCSB_container.mCS_no_scrollbar{
    margin-left:0;
    margin-bottom:30px
}
.mCSB_horizontal.mCustomScrollBox>.mCSB_scrollTools{
    width:100%;
    height:16px;
    top:auto;
    left:auto;
    bottom:0;
    right:0;
    overflow:hidden
}
.mCSB_horizontal>.mCSB_scrollTools a+.mCSB_draggerContainer{
    margin:0 20px
}
.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
    width:100%;
    height:4px;
    margin:7px 0;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px
}
.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger{
    width:30px;
    height:100%
}
.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:100%;
    height:4px;
    margin:6px auto;
    -webkit-border-radius:10px;
    -moz-border-radius:10px;
    border-radius:10px
}
.mCSB_horizontal>.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_horizontal>.mCSB_scrollTools .mCSB_buttonRight{
    display:block;
    position:relative;
    width:20px;
    height:100%;
    overflow:hidden;
    margin:0 auto;
    cursor:pointer;
    float:right
}
.mCSB_horizontal>.mCSB_scrollTools .mCSB_buttonRight{
    margin-right:-40px;
    float:left
}
.mCustomScrollBox{
    -ms-touch-action:none;
/*MSPointer events - direct all pointer events to js*/
    
}
/* default scrollbar colors and backgrounds (default theme) */
.mCustomScrollBox>.mCSB_scrollTools{
    opacity:0.75;
    filter:"alpha(opacity=75)";
    -ms-filter:"alpha(opacity=75)";
/* old ie */
    
}
.mCustomScrollBox:hover>.mCSB_scrollTools{
    opacity:1;
    filter:"alpha(opacity=100)";
    -ms-filter:"alpha(opacity=100)";
/* old ie */
    
}
.mCSB_scrollTools .mCSB_draggerRail{
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.4);
    filter:"alpha(opacity=40)";
    -ms-filter:"alpha(opacity=40)";
/* old ie */
    
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    background:#fff;
/* rgba fallback */
    background:rgba(0,0,0,0.75);
    filter:"alpha(opacity=75)";
    -ms-filter:"alpha(opacity=75)";
/* old ie */
    
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
    background:rgba(0,0,0,0.85);
    filter:"alpha(opacity=85)";
    -ms-filter:"alpha(opacity=85)";
/* old ie */
    
}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
    background:rgba(0,0,0,0.9);
    filter:"alpha(opacity=90)";
    -ms-filter:"alpha(opacity=90)";
/* old ie */
    
}
.mCSB_scrollTools .mCSB_buttonUp,.mCSB_scrollTools .mCSB_buttonDown,.mCSB_scrollTools .mCSB_buttonLeft,.mCSB_scrollTools .mCSB_buttonRight{
    background-image:url(mCSB_buttons.png);
    background-repeat:no-repeat;
    opacity:0.4;
    filter:"alpha(opacity=40)";
    -ms-filter:"alpha(opacity=40)";
/* old ie */
    
}
.mCSB_scrollTools .mCSB_buttonUp{
    background-position:0 0;
/* sprites locations are 0 0/-16px 0/-32px 0/-48px 0 (light) and -80px 0/-96px 0/-112px 0/-128px 0 (dark) */
    
}
.mCSB_scrollTools .mCSB_buttonDown{
    background-position:0 -20px;
/* sprites locations are 0 -20px/-16px -20px/-32px -20px/-48px -20px (light) and -80px -20px/-96px -20px/-112px -20px/-128px -20px (dark) */
    
}
.mCSB_scrollTools .mCSB_buttonLeft{
    background-position:0 -40px;
/* sprites locations are 0 -40px/-20px -40px/-40px -40px/-60px -40px (light) and -80px -40px/-100px -40px/-120px -40px/-140px -40px (dark) */
    
}
.mCSB_scrollTools .mCSB_buttonRight{
    background-position:0 -56px;
/* sprites locations are 0 -56px/-20px -56px/-40px -56px/-60px -56px (light) and -80px -56px/-100px -56px/-120px -56px/-140px -56px (dark) */
    
}
.mCSB_scrollTools .mCSB_buttonUp:hover,.mCSB_scrollTools .mCSB_buttonDown:hover,.mCSB_scrollTools .mCSB_buttonLeft:hover,.mCSB_scrollTools .mCSB_buttonRight:hover{
    opacity:0.75;
    filter:"alpha(opacity=75)";
    -ms-filter:"alpha(opacity=75)";
/* old ie */
    
}
.mCSB_scrollTools .mCSB_buttonUp:active,.mCSB_scrollTools .mCSB_buttonDown:active,.mCSB_scrollTools .mCSB_buttonLeft:active,.mCSB_scrollTools .mCSB_buttonRight:active{
    opacity:0.9;
    filter:"alpha(opacity=90)";
    -ms-filter:"alpha(opacity=90)";
/* old ie */
    
}
/*scrollbar themes*/
/*dark (dark colored scrollbar)*/
.mCS-dark>.mCSB_scrollTools .mCSB_draggerRail{
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.15)
}
.mCS-dark>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.75)
}
.mCS-dark>.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
    background:rgba(0,0,0,0.85)
}
.mCS-dark>.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-dark>.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
    background:rgba(0,0,0,0.9)
}
.mCS-dark>.mCSB_scrollTools .mCSB_buttonUp{
    background-position:-80px 0
}
.mCS-dark>.mCSB_scrollTools .mCSB_buttonDown{
    background-position:-80px -20px
}
.mCS-dark>.mCSB_scrollTools .mCSB_buttonLeft{
    background-position:-80px -40px
}
.mCS-dark>.mCSB_scrollTools .mCSB_buttonRight{
    background-position:-80px -56px
}
/*light-2*/
.mCS-light-2>.mCSB_scrollTools .mCSB_draggerRail{
    width:4px;
    background:#fff;
/* rgba fallback */
    background:rgba(255,255,255,0.1);
    -webkit-border-radius:1px;
    -moz-border-radius:1px;
    border-radius:1px
}
.mCS-light-2>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:4px;
    background:#fff;
/* rgba fallback */
    background:rgba(255,255,255,0.75);
    -webkit-border-radius:1px;
    -moz-border-radius:1px;
    border-radius:1px
}
.mCS-light-2.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
    width:100%;
    height:4px;
    margin:6px 0
}
.mCS-light-2.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:100%;
    height:4px;
    margin:6px auto
}
.mCS-light-2>.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
    background:rgba(0,0,0,0.85)
}
.mCS-light-2>.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-light-2>.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
    background:rgba(0,0,0,0.9)
}
.mCS-light-2>.mCSB_scrollTools .mCSB_buttonUp{
    background-position:-32px 0
}
.mCS-light-2>.mCSB_scrollTools .mCSB_buttonDown{
    background-position:-32px -20px
}
.mCS-light-2>.mCSB_scrollTools .mCSB_buttonLeft{
    background-position:-40px -40px
}
.mCS-light-2>.mCSB_scrollTools .mCSB_buttonRight{
    background-position:-40px -56px
}
/*dark-2*/
.mCS-dark-2>.mCSB_scrollTools .mCSB_draggerRail{
    width:4px;
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.1);
    -webkit-border-radius:1px;
    -moz-border-radius:1px;
    border-radius:1px
}
.mCS-dark-2>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:4px;
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.75);
    -webkit-border-radius:1px;
    -moz-border-radius:1px;
    border-radius:1px
}
.mCS-dark-2.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
    width:100%;
    height:4px;
    margin:6px 0
}
.mCS-dark-2.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:100%;
    height:4px;
    margin:6px auto
}
.mCS-dark-2>.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
    background:rgba(0,0,0,0.85)
}
.mCS-dark-2>.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-dark-2>.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
    background:rgba(0,0,0,0.9)
}
.mCS-dark-2>.mCSB_scrollTools .mCSB_buttonUp{
    background-position:-112px 0
}
.mCS-dark-2>.mCSB_scrollTools .mCSB_buttonDown{
    background-position:-112px -20px
}
.mCS-dark-2>.mCSB_scrollTools .mCSB_buttonLeft{
    background-position:-120px -40px
}
.mCS-dark-2>.mCSB_scrollTools .mCSB_buttonRight{
    background-position:-120px -56px
}
/*light-thick*/
.mCS-light-thick>.mCSB_scrollTools .mCSB_draggerRail{
    width:4px;
    background:#fff;
/* rgba fallback */
    background:rgba(0,0,0,0.1);
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px
}
.mCS-light-thick>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:6px;
    background:#fff;
/* rgba fallback */
    background:rgba(0,0,0,0.75);
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px
}
.mCS-light-thick.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
    width:100%;
    height:4px;
    margin:6px 0
}
.mCS-light-thick.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:100%;
    height:6px;
    margin:5px auto
}
.mCS-light-thick>.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
    background:rgba(0,0,0,0.85)
}
.mCS-light-thick>.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-light-thick>.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
    background:rgba(0,0,0,0.9)
}
.mCS-light-thick>.mCSB_scrollTools .mCSB_buttonUp{
    background-position:-16px 0
}
.mCS-light-thick>.mCSB_scrollTools .mCSB_buttonDown{
    background-position:-16px -20px
}
.mCS-light-thick>.mCSB_scrollTools .mCSB_buttonLeft{
    background-position:-20px -40px
}
.mCS-light-thick>.mCSB_scrollTools .mCSB_buttonRight{
    background-position:-20px -56px
}
/*dark-thick*/
.mCS-dark-thick>.mCSB_scrollTools .mCSB_draggerRail{
    width:4px;
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.1);
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px
}
.mCS-dark-thick>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:6px;
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.75);
    -webkit-border-radius:2px;
    -moz-border-radius:2px;
    border-radius:2px
}
.mCS-dark-thick.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
    width:100%;
    height:4px;
    margin:6px 0
}
.mCS-dark-thick.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:100%;
    height:6px;
    margin:5px auto
}
.mCS-dark-thick>.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
    background:rgba(0,0,0,0.85)
}
.mCS-dark-thick>.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-dark-thick>.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
    background:rgba(0,0,0,0.9)
}
.mCS-dark-thick>.mCSB_scrollTools .mCSB_buttonUp{
    background-position:-96px 0
}
.mCS-dark-thick>.mCSB_scrollTools .mCSB_buttonDown{
    background-position:-96px -20px
}
.mCS-dark-thick>.mCSB_scrollTools .mCSB_buttonLeft{
    background-position:-100px -40px
}
.mCS-dark-thick>.mCSB_scrollTools .mCSB_buttonRight{
    background-position:-100px -56px
}
/*light-thin*/
.mCS-light-thin>.mCSB_scrollTools .mCSB_draggerRail{
    background:#fff;
/* rgba fallback */
    background:rgba(0,0,0,0.1)
}
.mCS-light-thin>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:4px
}
.mCS-light-thin.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
    width:100%
}
.mCS-light-thin.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:100%;
    height:2px;
    margin:7px auto
}
/*dark-thin*/
.mCS-dark-thin>.mCSB_scrollTools .mCSB_draggerRail{
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.15)
}
.mCS-dark-thin>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:4px;
    background:#000;
/* rgba fallback */
    background:rgba(0,0,0,0.75)
}
.mCS-dark-thin.mCSB_horizontal>.mCSB_scrollTools .mCSB_draggerRail{
    width:100%
}
.mCS-dark-thin.mCSB_horizontal>.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
    width:100%;
    height:2px;
    margin:7px auto
}
.mCS-dark-thin>.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
    background:rgba(0,0,0,0.85)
}
.mCS-dark-thin>.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,.mCS-dark-thin>.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
    background:rgba(0,0,0,0.9)
}
.mCS-dark-thin>.mCSB_scrollTools .mCSB_buttonUp{
    background-position:-80px 0
}
.mCS-dark-thin>.mCSB_scrollTools .mCSB_buttonDown{
    background-position:-80px -20px
}
.mCS-dark-thin>.mCSB_scrollTools .mCSB_buttonLeft{
    background-position:-80px -40px
}
.mCS-dark-thin>.mCSB_scrollTools .mCSB_buttonRight{
    background-position:-80px -56px
}
.portfolio-list-page a,.portfolio-list-page span{
    display:inline-block;
    border:1px solid #c8c8c8;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    padding:5px 15px;
    margin: 0 0 6px 6px;
    color:#666666;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list-page a,.portfolio-list-page a:link,.portfolio-list-page a:active,.portfolio-list-page a:visited{
    color:#666666;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list-page a:hover,.portfolio-list-page span{
    background-color:#20a3f0;
    border-color:#20a3f0;
    color:#FFF
}
.portfolio-list-page em,.portfolio-list-page i{
    font-style:normal;
    font-size:14px;
    color:#666666;
    padding-left:10px
}
.portfolio-list-page .disabled{
    pointer-events:none;
    cursor:default;
    border-color:#d2d2d2!important;
    color:#d2d2d2!important
}
.portfolio-isotope.loading:before{
    content:"";
    z-index:10;
    position:absolute;
    background:url(../images/loader.gif) no-repeat center center;
    right:50%;
    top:50%;
    width:37px;
    height:37px;
    margin:-15px 0 0 -15px
}
.portfolio-isotope .element{
    position:absolute;
    top:0;
    right:auto;
}
.portfolio-isotope.loading .portfolio-mian{
    visibility:hidden;
    opacity:0
}
.portfolio-isotope .portfolio-mian{
    visibility:visible;
    opacity:1;
    transition:opacity ease-in 300ms;
    -moz-transition:opacity ease-in 300ms;
/* Firefox 4 */
    -webkit-transition:opacity ease-in 300ms;
/* Safari and Chrome */
    -o-transition:opacity ease-in 300ms;
/* Opera */
    -ms-transition:opacity ease-in 300ms;
/* IE9? */
    
}
.portfolio-list01-mid{
    margin:0 20px
}
.portfolio-list01.loading:before{
    top:100%;
    margin-top:0
}
.portfolio-list01 img{
    max-width:100%
}
.portfolio-list01 .filter-box{
    margin-bottom:40px
}
.portfolio-list01 .filters a{
    border:1px solid #dcdcdc;
    padding:4px 20px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    color:#666666;
    margin: 0 0 5px 5px
}
.portfolio-list01 .filters a:hover{
    color:#20a3f0;
    text-decoration:none
}
.portfolio-list01 .filters a.active{
    background-color:#20a3f0;
    border-color:#20a3f0;
    color:#FFF!important
}
.portfolio-list01 .element-box{
    position:relative;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list01 .portfolio-mian .element{
    
}
.portfolio-list01 .portfolio-mian .element-date{
    color:#666666;
    margin-bottom:8px
}
.portfolio-list01 .element-pic{
    position:relative;
    margin-bottom:18px
}
.portfolio-list01 .element-pic:before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background-color:#000;
    background-color:rgba(0,0,0,0.7);
    opacity:0;
    visibility:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list01 .element-pic .ico{
    position:absolute;
    top:50%;
    right:0;
    left:0;
    text-align:center;
    margin-top:-23px;
    opacity:0;
    visibility:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list01 .element:hover .element-pic:before,.portfolio-list01 .element:hover .element-pic .ico{
    opacity:1;
    visibility:visible
}
.portfolio-list01 .element-pic .prolight_image_group{
    display:inline-block
}
.portfolio-list01 .element-pic .ico-left,.portfolio-list01 .element-pic .ico-right{
    width:45px;
    height:45px;
    line-height:45px;
    text-align:center;
    background-color:#20a3f0;
    display:inline-block;
    margin:0 4px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    color:#FFF;
    font-size:18px;
    transition:background-color ease-in 200ms;
    -moz-transition:background-color ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:background-color ease-in 200ms;
/* Safari and Chrome */
    -o-transition:background-color ease-in 200ms;
/* Opera */
    -ms-transition:background-color ease-in 200ms;
/* IE9? */
    
}
.portfolio-list01 .element-pic .ico-left:hover,.portfolio-list01 .element-pic .ico-right:hover{
    background-color:#333
}
.portfolio-list01 .portfolio-mian h3{
    margin:10px 0 2px;
    font-size:18px
}
.portfolio-list01 .portfolio-mian h3 a,.portfolio-list01 .portfolio-mian h3 a:link,.portfolio-list01 .portfolio-mian h3 a:active,.portfolio-list01 .portfolio-mian h3 a:visited{
    font-size:18px;
    color:#666666
}
.portfolio-list01 .element-info{
    margin-bottom:20px
}
.portfolio-list01 .element-info p{
    font-size:15px
}
.portfolio-list01 .element-info p a,.portfolio-list01 .element-info p a:link,.portfolio-list01 .element-info p a:active,.portfolio-list01 .element-info p a:visited{
    color:#666666
}
.portfolio-list01 .portfolio-mian h3 a:hover,.portfolio-list01 .element-info p a:hover{
    color:#20a3f0
}
.portfolio-list02-mid{
    margin:0 20px
}
.portfolio-list02.loading:before{
    top:100%;
    margin-top:10px
}
.portfolio-list02 img{
    max-width:100%
}
.portfolio-list02 .filter-box{
    margin-bottom:40px
}
.portfolio-list02 .filters a{
    border:1px solid #dcdcdc;
    padding:4px 20px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    color:#666666;
    margin: 0 0 5px 5px
}
.portfolio-list02 .filters a:hover{
    color:#20a3f0;
    text-decoration:none
}
.portfolio-list02 .filters a.active{
    background-color:#20a3f0;
    border-color:#20a3f0;
    color:#FFF!important
}
.portfolio-list02 .portfolio-mian{
    display:none;
    color:#FFF;
    text-align:center
}
.portfolio-list02 .element-box{
    position:relative
}
.portfolio-list02 .portfolio-mian .element{
    float:right;
    position:relative
}
.portfolio-list02 .portfolio-mian .element-date{
    color:#FFF;
    font-size:14px;
    margin-bottom:18px
}
.portfolio-list02 .element-pic{
    position:relative;
    margin:0;
    text-align:center
}
.portfolio-list02 .element-pic:before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background-color:#000;
    background-color:rgba(0,0,0,0.7);
    opacity:0;
    visibility:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list02 .element:hover .element-pic:before{
    opacity:1;
    visibility:visible
}
.portfolio-list02 .element-info .ico{
    text-align:center;
    margin-top:18px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list02 .element-info .prolight_image_group{
    display:inline-block
}
.portfolio-list02 .element-info .ico-left,.portfolio-list02 .element-info .ico-right{
    width:45px;
    height:45px;
    line-height:45px;
    text-align:center;
    background-color:#20a3f0;
    display:inline-block;
    margin:0 4px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    color:#FFF;
    font-size:18px;
    transition:background-color ease-in 200ms;
    -moz-transition:background-color ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:background-color ease-in 200ms;
/* Safari and Chrome */
    -o-transition:background-color ease-in 200ms;
/* Opera */
    -ms-transition:background-color ease-in 200ms;
/* IE9? */
    
}
.portfolio-list02 .element-info .ico-left:hover,.portfolio-list02 .element-info .ico-right:hover{
    background-color:#333
}
.portfolio-list02 .portfolio-mian h3{
    margin:10px 0 2px;
    font-size:18px
}
.portfolio-list02 .portfolio-mian h3 a,.portfolio-list02 .portfolio-mian h3 a:link,.portfolio-list02 .portfolio-mian h3 a:active,.portfolio-list02 .portfolio-mian h3 a:visited{
    font-size:18px;
    color:#FFF
}
.portfolio-list02 .element-info{
    margin-bottom:20px;
    position:absolute;
    top:50%;
    right:0;
    left:0;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    opacity:0;
    visibility:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list02 .element-info p{
    font-size:15px
}
.portfolio-list02 .element-info p a,.portfolio-list02 .element-info p a:link,.portfolio-list02 .element-info p a:active,.portfolio-list02 .element-info p a:visited{
    color:#FFF
}
.portfolio-list02 .portfolio-mian h3 a:hover,.portfolio-list02 .element-info p a:hover{
    color:#20a3f0
}
.portfolio-list02 .element:hover .element-info{
    opacity:1;
    visibility:visible
}
.portfolio-list03-mid{
    margin:0 20px
}
.portfolio-list03.loading:before{
    top:100%;
    margin-top:10px
}
.portfolio-list03 img{
    max-width:100%
}
.portfolio-list03 .filter-box{
    margin-bottom:40px
}
.portfolio-list03 .filters a{
    border:1px solid #dcdcdc;
    padding:4px 20px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    color:#666666;
    margin: 0 0 5px 5px
}
.portfolio-list03 .filters a:hover{
    color:#20a3f0;
    text-decoration:none
}
.portfolio-list03 .filters a.active{
    background-color:#20a3f0;
    border-color:#20a3f0;
    color:#FFF!important
}
.portfolio-list03 .element-box{
    position:relative
}
.portfolio-list03 .portfolio-mian .element{
    width:25%;
    float:right;
    position:relative
}
.portfolio-list03 .portfolio-mian .element-date{
    color:#FFF;
    margin-bottom:18px
}
.portfolio-list03 .element-pic{
    position:relative;
    text-align:center
}
.portfolio-list03 .element-pic:before{
    content:"";
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background-color:#000;
    background-color:rgba(0,0,0,0.7);
    opacity:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list03 .element:hover .element-pic:before{
    opacity:1
}
.portfolio-list03 .element-info .ico{
    text-align:center;
    margin-top:18px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list03 .element-info .prolight_image_group{
    display:inline-block
}
.portfolio-list03 .element-info .ico-left,.portfolio-list03 .element-info .ico-right{
    width:45px;
    height:45px;
    line-height:45px;
    text-align:center;
    background-color:#20a3f0;
    display:inline-block;
    margin:0 4px;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    color:#FFF;
    font-size:18px;
    transition:background-color ease-in 200ms;
    -moz-transition:background-color ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:background-color ease-in 200ms;
/* Safari and Chrome */
    -o-transition:background-color ease-in 200ms;
/* Opera */
    -ms-transition:background-color ease-in 200ms;
/* IE9? */
    
}
.portfolio-list03 .element-info .ico-left:hover,.portfolio-list03 .element-info .ico-right:hover{
    background-color:#333
}
.portfolio-list03 .portfolio-mian{
    color:#FFF;
    text-align:center
}
.portfolio-list03 .portfolio-mian h3{
    margin:10px 0 2px;
    font-size:18px
}
.portfolio-list03 .portfolio-mian h3 a,.portfolio-list03 .portfolio-mian h3 a:link,.portfolio-list03 .portfolio-mian h3 a:active,.portfolio-list03 .portfolio-mian h3 a:visited{
    font-size:18px;
    color:#FFF
}
.portfolio-list03 .element-info{
    margin-bottom:20px;
    position:absolute;
    top:50%;
    right:0;
    left:0;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    opacity:0;
    visibility:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list03 .element-info p{
    font-size:13px
}
.portfolio-list03 .element-info p a,.portfolio-list03 .element-info p a:link,.portfolio-list03 .element-info p a:active,.portfolio-list03 .element-info p a:visited{
    color:#FFF
}
.portfolio-list03 .portfolio-mian h3 a:hover,.portfolio-list03 .element-info p a:hover{
    color:#20a3f0
}
.portfolio-list03 .element:hover .element-info{
    opacity:1;
    visibility:visible
}
.portfolio-list03 .ico{
    position:absolute;
    top:0;
    left:0
}
.portfolio-list03 .ico span{
    width:44px;
    height:44px;
    line-height:44px;
    text-align:center;
    background-color:#20a3f0;
    color:#FFF;
    font-size:26px;
    opacity:0;
    visibility:hidden;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list03 .element:hover .ico span{
    opacity:1;
    visibility:visible
}
.portfolio-list04-mid{
    margin:0 20px
}
.portfolio-list04.loading:before{
    top:100px
}
.portfolio-list04 img{
    max-width:100%
}
.portfolio-list04 .filter-box{
    margin-bottom:40px;
    text-align:center
}
.portfolio-list04 .filters a{
    border:1px solid #dcdcdc;
    padding:4px 20px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    color:#666666;
    margin: 0 0 5px 5px
}
.portfolio-list04 .filters a:hover{
    color:#20a3f0;
    text-decoration:none
}
.portfolio-list04 .filters a.active{
    background-color:#20a3f0;
    border-color:#20a3f0;
    color:#FFF!important
}
.portfolio-list04 .element{
    margin-bottom:-1px;
    transition:background ease-in 200ms;
    -moz-transition:background ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:background ease-in 200ms;
/* Safari and Chrome */
    -o-transition:background ease-in 200ms;
/* Opera */
    -ms-transition:background ease-in 200ms;
/* IE9? */
    position:relative
}
.portfolio-list04 .element:after{
    content:"";
    display:block;
    clear:both
}
.portfolio-list04 .element-pic{
    float:right;
    margin:0;
    position:relative;
    width:66%
}
.portfolio-list04 .element-pic img{
    width:100%
}
.portfolio-list04 .element-view{
    width:34%;
    position:absolute;
    left:0;
    top:0;
    height:100%;
    padding:30px;
    transition:color ease-in 200ms;
    -moz-transition:color ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:color ease-in 200ms;
/* Safari and Chrome */
    -o-transition:color ease-in 200ms;
/* Opera */
    -ms-transition:color ease-in 200ms;
/* IE9? */
    border:1px solid #ebebeb
}
.portfolio-list04 .element-view h3{
    margin:0 0 15px;
    font-size:22px
}
.portfolio-list04 .element-view h3 a,.portfolio-list04 .element-view h3 a:link,.portfolio-list04 .element-view h3 a:active,.portfolio-list04 .element-view h3 a:visited{
    color:#666666
}
.portfolio-list04 .element-info{
    border-bottom:1px solid #dcdcdc;
    padding-bottom:7px;
    margin-bottom:20px;
    font-size:14px
}
.portfolio-list04 .element-info .sep{
    padding:0 5px
}
.portfolio-list04 .element-view .more{
    color:#20a3f0;
    border:1px solid #20a3f0;
    padding:8px 11px;
    margin-top:22px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list04 .element:hover{
    background-color:#20a3f0;
    color:#FFF
}
.portfolio-list04 .element .element-pic:after{
    content:"";
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    background-color:#000000;
    opacity:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list04 .element:hover .element-pic:after{
    opacity:0.5
}
.portfolio-list04 .element:hover .element-view a,.portfolio-list04 .element:hover .element-view a:link,.portfolio-list04 .element:hover .element-view a:active,.portfolio-list04 .element:hover .element-view a:visited{
    color:#FFF
}
.portfolio-list04 .element:hover .element-view .more{
    color:#FFF;
    border:1px solid #FFF
}
@media only screen and (min-width:768px) and (max-width:991px){ 
    .portfolio-list04 .element-view{
        padding:20px
    }
}
@media only screen and (max-width:767px){   
    .portfolio-list04 .element{
        margin-bottom:20px
    }
    .portfolio-list04 .element-pic{
        float:none;
        border:none;
        margin:0;
        position:relative;
        max-width:100%;
        width:auto
    }
    .portfolio-list04 .element-view{
        padding:20px;
        position:static;
        height:auto;
        width:auto
    }
}
.portfolio-list05-mid{
    margin:0 20px
}
.portfolio-list05.loading:before{
    top:40%
}
.portfolio-list05{
    overflow:hidden
}
.portfolio-list05 img{
    max-width:100%
}
.portfolio-list05 .filter-box{
    margin-bottom:40px;
    text-align:center
}
.portfolio-list05 .filters a{
    border:1px solid #dcdcdc;
    padding:4px 20px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    color:#666666;
    margin: 0 0 5px 5px
}
.portfolio-list05 .filters a:hover{
    color:#20a3f0;
    text-decoration:none
}
.portfolio-list05 .filters a.active{
    background-color:#20a3f0;
    border-color:#20a3f0;
    color:#FFF!important
}
.portfolio-list05 .element{
    float:right;
    width:25%
}
.portfolio-list05 .element-view{
    position:absolute;
    top:50%;
    right:0;
    left:0;
    text-align:center;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    color:#FFF
}
.portfolio-list05 .element .element-box:before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    top:0;
    background-color:#000;
    opacity:0.5
}
.portfolio-list05 .element-view h3{
    font-size:22px
}
.portfolio-list05 .element-view a,.portfolio-list05 .element-view a:link,.portfolio-list05 .element-view a:active,.portfolio-list05 .element-view a:visited{
    color:#FFF
}
.portfolio-list05 .element-view,.portfolio-list05 .element .element-box:before{
    opacity:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list05 .element:hover .element-view{
    opacity:1
}
.portfolio-list05 .element:hover .element-box:before{
    opacity:0.5
}
.portfolio-list05 .element-box{
    position:relative
}
.portfolio-list05 .portfolio-mian{
    
}
.portfolio-list05 .line:after,.portfolio-list05 .line:before,.portfolio-list05 .element-pic:after,.portfolio-list05 .element-pic:before{
    content:"";
    width:100px;
    height:100px;
    position:absolute;
    opacity:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list05 .element-box:hover .line:after,.portfolio-list05 .element-box:hover .line:before,.portfolio-list05 .element-box:hover .element-pic:after,.portfolio-list05 .element-box:hover .element-pic:before{
    opacity:1
}
.portfolio-list05 .line:after{
    border-right:1px solid #ffffff;
    border-top:1px solid #ffffff;
    right:20px;
    top:20px
}
.portfolio-list05 .line:before{
    border-left:1px solid #ffffff;
    border-bottom:1px solid #ffffff;
    left:20px;
    bottom:20px
}
.portfolio-list05 .element-pic:after{
    border-right:1px solid #ffffff;
    border-bottom:1px solid #ffffff;
    right:20px;
    bottom:20px
}
.portfolio-list05 .element-pic:before{
    border-left:1px solid #ffffff;
    border-top:1px solid #ffffff;
    left:20px;
    top:20px
}
.portfolio-list05 .element-date{
    margin-bottom:20px;
    font-size:16px
}
.portfolio-list05 .loadmore{
    display:inline-block;
    min-width:300px;
    max-width:100%;
    text-align:center;
    padding:16px 20px;
    background-color:#20a3f0;
    color:#FFF;
    border-radius:6px;
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    margin-top:60px;
    font-size:15px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list05 .loadmore:hover{
    text-decoration:none;
    background-color:#333
}
@media only screen and (max-width:767px){   
    .portfolio-list05 .line:after,.portfolio-list05 .line:before,.portfolio-list05 .element-pic:after,.portfolio-list05 .element-pic:before{
        width:30px;
        height:30px
    }
}
.portfolio-list06.loading:before{
    top:100px
}
.portfolio-list06-mid{
    margin:0 20px
}
.portfolio-list06{
    overflow:hidden
}
.portfolio-list06 img{
    max-width:100%
}
.portfolio-list06 .filter-box{
    margin-bottom:40px;
    text-align:center
}
.portfolio-list06 .filters a{
    border:1px solid #dcdcdc;
    padding:4px 20px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    color:#666666;
    margin: 0 0 5px 5px
}
.portfolio-list06 .filters a:hover{
    color:#20a3f0;
    text-decoration:none
}
.portfolio-list06 .filters a.active{
    background-color:#20a3f0;
    border-color:#20a3f0;
    color:#FFF!important
}
.portfolio-list06 .element{
    float:right
}
.portfolio-list06 .element-view{
    position:absolute;
    top:50%;
    right:0;
    left:0;
    text-align:center;
    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    color:#FFF
}
.portfolio-list06 .element-date{
    margin-bottom:20px
}
.portfolio-list06 .element .element-pic:before{
    content:"";
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    top:0;
    background-color:#000;
    opacity:0.5
}
.portfolio-list06 .element-view h3{
    font-size:22px;
    margin-bottom:15px
}
.portfolio-list06 .element-view a,.portfolio-list06 .element-view a:link,.portfolio-list06 .element-view a:active,.portfolio-list06 .element-view a:visited{
    color:#FFF
}
.portfolio-list06 .element-view,.portfolio-list06 .element .element-pic:before{
    opacity:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-list06 .element:hover .element-view{
    opacity:1
}
.portfolio-list06 .element:hover .element-pic:before{
    opacity:0.5
}
.portfolio-list06 .element-box{
    position:relative
}
.portfolio-list06 .portfolio-mian{
    display:none
}
.portfolio-list06 .element-category{
    background-color:#20a3f0;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    display:inline-block;
    padding:2px 8px
}
.portfolio-list06 div.element-category a:hover{
    color:#FFF
}
/*detail*/
.portfolio-detail .detail-port-nav{
    border-bottom:1px solid #ebebeb;
    margin-bottom:80px;
    font-size:20px;
    direction:ltr;
    padding-bottom:12px
}
.portfolio-detail .detail-port-nav .nav-return{
    display:inline-block;
    border:1px solid #20a3f0;
    width:38px;
    height:38px;
    line-height:38px;
    text-align:center;
    border-radius:5px;
    -moz-border-radius:5px;
    -webkit-border-radius:5px
}
.portfolio-detail .detail-port-nav .nav-prev,.portfolio-detail .detail-port-nav .nav-next{
    float:right;
    width:38px;
    height:38px;
    line-height:38px;
    text-align:center
}
.portfolio-detail .detail-port-nav .fa{
    margin:0
}
.portfolio-detail .detail-title{
    color:#666666;
    font-size:18px;
    margin:0 0 3px
}
.portfolio-detail .detail-info{
    color:#666666;
    margin-bottom:20px
}
.portfolio-detail .sep{
    padding:0 5px
}
.portfolio-detail .fa{
    margin-left:3px
}
.portfolio-detail .detail-preview{
    display:inline-block;
    border:1px solid #20a3f0;
    padding:10px 20px;
    margin:30px 0;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    color:#20a3f0;
    font-size:14px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-detail .detail-preview:hover{
    text-decoration:none;
    color:#FFF;
    background-color:#20a3f0
}
.portfolio-detail .detail-skills dt{
    margin-bottom:10px;
    font-size:13px
}
.portfolio-detail .detail-skills dd{
    color:#999999;
    font-size:13px
}
.portfolio-detail .detail-skills dd .fa{
    color:#20a3f0;
    font-size:13px;
    margin: 0 0 0 3px
}
.portfolio-detail .detail-info2{
    color:#666;
    font-size:14px
}
.portfolio-detail .detail-info2 dt{
    float:right;
    width:30%;
    color:#666666;
    font-size:14px;
    font-weight:normal
}
.portfolio-detail .detail-info2 dl{
    margin:0;
    padding:10px 0;
    border-bottom:1px solid #eeeeee
}
.portfolio-detail .detail-info2 dl:after{
    content:"";
    clear:both;
    display:block
}
.portfolio-detail .detail-info2 dd{
    overflow:hidden
}
.portfolio-detail .detail-author{
    border-top:1px solid #ebebeb;
    border-bottom:1px solid #ebebeb;
    padding:30px 40px;
    margin-bottom:60px
}
.portfolio-detail .detail-author:after{
    content:"";
    clear:both;
    display:block
}
.portfolio-detail .detail-author .author-portrait{
    float:right;
    margin-left:55px;
    text-align:center
}
.portfolio-detail .detail-author .author-portrait img{
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    margin-bottom:25px
}
.portfolio-detail .detail-author a{
    width:25px;
    height:25px;
    line-height:25px;
    text-align:center;
    display:inline-block;
    background-color:#f4f4f4;
    color:#000000;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-detail .detail-author a:hover{
    color:#FFF
}
.portfolio-detail .detail-author .author-right{
    overflow:hidden
}
.portfolio-detail .detail-author .author-right .author-title{
    color:#555555;
    font-size:14px
}
.portfolio-detail .detail-author .author-right .author-title span{
    display:block;
    color:#666666;
    font-size:13px;
    font-weight:normal
}
.portfolio-detail .detail-author2{
    padding:30px 40px;
    margin-bottom:60px;
    background-color:#f8f8f8
}
.portfolio-detail .detail-author2:after{
    content:"";
    clear:both;
    display:block
}
.portfolio-detail .detail-author2 .author-portrait{
    float:right;
    margin-left:55px;
    text-align:center
}
.portfolio-detail .detail-author2 .author-portrait img{
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    margin-bottom:25px
}
.portfolio-detail .detail-author2 a{
    width:25px;
    height:25px;
    line-height:25px;
    text-align:center;
    display:inline-block;
    background-color:#f4f4f4;
    color:#000000;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px
}
.portfolio-detail .detail-author2 .author-right{
    overflow:hidden
}
.portfolio-detail .detail-author2 .author-right .author-title{
    color:#555555;
    font-size:14px
}
.portfolio-detail .detail-author2 .author-right .author-title span{
    display:block;
    color:#666666;
    font-size:13px;
    font-weight:normal
}
@media only screen and (max-width:767px){   
    .portfolio-detail .detail-author,.portfolio-detail .detail-author2{
        padding:0;
        border:none
    }
    .portfolio-detail .detail-author .author-portrait,.portfolio-detail .detail-author2 .author-portrait{
        float:none;
        margin:0 auto 20px
    }
}
.portfolio-detail .detail-heading{
    font-size:24px;
    color:#666666;
    margin-bottom:30px
}
.portfolio-detail .detail-related{
    font-size:15px;
    color:#666666;
    padding-bottom:20px
}
.portfolio-detail .detail-related img{
    max-width:100%;
    margin-bottom:20px
}
.portfolio-detail .detail-related a,.portfolio-detail .detail-related a:link,.portfolio-detail .detail-related a:active,.portfolio-detail .detail-related a:visited{
    color:#666666
}
.portfolio-detail .detail-related h3{
    margin:0 0 3px;
    color:#666666;
    font-size:18px
}
.portfolio-detail .detail-related .date{
    font-size:14px;
    margin-bottom:15px;
    color:#666666
}
.gallery-carousel.loading{
    display:none
}
.gallery-carousel img{
    max-width:100%
}
.gallery-carousel .slick-slide{
    position:relative;
    outline:none
}
.gallery-carousel .slick-arrow{
    position:absolute;
    right:0;
    top:50%;
    border:none;
    outline:none;
    z-index:3;
    font-size:0;
    overflow:hidden;
    background-color:#20a3f0;
    width:35px;
    height:35px;
    margin-top:-18px;
    text-align:center;
    border-radius: 2px 0 0 2px;
    -moz-border-radius: 2px 0 0 2px;
    -webkit-border-radius: 2px 0 0 2px;
    display:none
}
.gallery-carousel .slick-arrow:before{
    content:"";
    position:absolute;
    right:50%;
    top:50%;
    width:8px;
    height:8px;
    margin:-4px 0 0 -3px;
    border-right:1px solid #FFF;
    border-bottom:1px solid #FFF;
    transform:rotate(-45deg);
    -webkit-transform:rotate(-45deg)
}
.gallery-carousel .slick-arrow.slick-next{
    right:auto;
    left:0
}
.gallery-carousel .slick-arrow.slick-next:before{
    transform:rotate(135deg);
    -webkit-transform:rotate(135deg);
    right:auto;
    left:50%;
    margin:-4px -3px 0 0
}
.gallery-carousel .slick-dots{
    text-align:center;
    padding-top:20px
}
.gallery-carousel .slick-dots li{
    list-style:none;
    display:inline-block;
    margin:0 5px
}
.gallery-carousel .slick-dots li button{
    width:10px;
    height:10px;
    background:#c8c8c8;
    border:none;
    border-radius:50%;
    -moz-border-radius:50%;
    -webkit-border-radius:50%;
    display:block;
    font-size:0;
    text-indent:-999px;
    overflow:hidden;
    padding:0;
    outline:none;
    transition:background-color ease-in 200ms;
    -moz-transition:background-color ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:background-color ease-in 200ms;
/* Safari and Chrome */
    -o-transition:background-color ease-in 200ms;
/* Opera */
    -ms-transition:background-color ease-in 200ms;
/* IE9? */
    
}
.gallery-carousel .slick-dots li.slick-active button{
    background-color:#20a3f0
}
.gallery-carousel01{
    margin-bottom:40px
}
.gallery-carousel01 .item{
    padding:0 10px
}
.gallery-carousel01 .slick-slide:before{
    content:"";
    background-color:rgba(255,255,255,0.7);
    position:absolute;
    top:0;
    right:0;
    left:0;
    bottom:0;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.gallery-carousel01 .slick-slide.slick-current:before{
    opacity:0;
    visibility:hidden
}
.gallery-carousel01 .slick-arrow{
    right:2%;
    background-color:rgba(255,255,255,0.5);
    width:75px;
    height:75px;
    margin-top:-38px;
    border-radius:10px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    display:none
}
.gallery-carousel01 .slick-arrow:before{
    width:20px;
    height:20px;
    margin:-10px 0 0 -6px;
    border-right-color:#26a5ef;
    border-bottom-color:#26a5ef;
    transform:rotate(45deg);
    -webkit-transform:rotate(45deg)
}
.gallery-carousel01 .slick-arrow.slick-next{
    right:auto;
    left:2%
}
.gallery-carousel01 .slick-arrow.slick-next:before{
    transform:rotate(-135deg);
    -webkit-transform:rotate(-135deg);
    right:auto;
    left:50%;
    margin:-10px -6px 0 0
}
.gallery-carousel01 .loading:before{
    content:"";
    z-index:10;
    position:absolute;
    background:url(../images/loader.gif) no-repeat center center;
    right:50%;
    top:50%;
    width:30px;
    height:30px;
    margin:-15px 0 0 -15px
}
.gallery-carousel02{
    margin-bottom:40px
}
.gallery-carousel02 .slick-arrow{
    right:1px
}
.gallery-carousel02 .slick-arrow.slick-next{
    left:1px
}
.gallery-carousel02 .item{
    padding:0 1px
}
.gallery-carousel03{
    margin-bottom:40px
}
.gallery-carousel03 .slick-dots{
    position:absolute;
    bottom:20px;
    right:0;
    left:0;
    margin:0;
    padding:0
}
.gallery-carousel03 .slick-dots li{
    margin:0 4px
}
.gallery-carousel03 .slick-dots li button{
    border:1px solid #FFF;
    background-color:#FFF;
    width:12px;
    height:12px
}
.gallery-carousel03 .slick-dots li.slick-active button{
    background-color:transparent
}
.gallery-carousel04{
    margin-bottom:40px
}
.gallery-carousel04 .slick-dots{
    position:absolute;
    bottom:20px;
    right:0;
    left:0;
    margin:0;
    padding:0
}
.gallery-carousel04 .slick-dots li{
    margin:0 4px
}
.gallery-carousel04 .slick-dots li button{
    border:1px solid #FFF;
    background-color:#FFF;
    width:12px;
    height:12px
}
.gallery-carousel04 .slick-dots li.slick-active button{
    background-color:transparent
}
.portfolio-detail .gallery-img{
    margin-bottom:40px
}
.portfolio-detail .gallery-img img{
    max-width:100%
}
/**/
.portfolio-search{
    position:relative
}
.portfolio-search .textbox{
    box-sizing:border-box;
    -webkit-box-sizing:border-box;
    display:inline-block;
    margin:0;
    padding: 11px 10px 11px 50px;
    font-size:14px;
    line-height:20px;
    color:#555555;
    -webkit-border-radius:3px;
    -moz-border-radius:3px;
    border-radius:3px;
    background-color:#ffffff;
    border:1px solid #c8c8c8;
    -webkit-transition:border linear 0.2s,box-shadow linear 0.2s;
    -moz-transition:border linear 0.2s,box-shadow linear 0.2s;
    -o-transition:border linear 0.2s,box-shadow linear 0.2s;
    transition:border linear 0.2s,box-shadow linear 0.2s;
    width:100%;
    outline:none
}
.portfolio-search .submit{
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:40px;
    border:none;
    background:none
}
.portfolio-search:before{
    content:"\f002";
    font-family:"FontAwesome";
    position:absolute;
    top:0;
    left:0;
    height:100%;
    width:40px;
    text-align:center;
    line-height:44px;
    color:#20a3f0;
    font-size:16px
}
.portfolio-title01{
    font-size:20px;
    color:#20a3f0;
    margin-bottom:12px;
    line-height:1.2;
    font-weight:bold
}
.portfolio-categories,.portfolio-categories ul{
    list-style:none;
    margin:0;
    padding:0
}
.portfolio-categories > li,.portfolio-categories > li > ul > li{
    background-color:#fcfcfc;
    position:relative
}
.portfolio-categories > li > a,.portfolio-categories > li > ul > li > a{
    padding:10px 12px;
    color:#444444;
    display:block;
    font-weight:bold;
    border-top:1px solid #ffffff;
    border-bottom:1px solid #f5f5f5;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-categories a:hover{
    text-decoration:none
}
.portfolio-categories > li > .arrow{
    content:"";
    width:22px;
    height:22px;
    line-height:18px;
    text-align:center;
    border:2px solid #666666;
    position:absolute;
    top:12px;
    left:11px;
    display:inline-block;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px;
    cursor:pointer;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-categories > li > .arrow:before{
    content:"";
    border:5px solid transparent;
    border-bottom-width:0;
    border-top-color:#666666;
    display:inline-block;
    vertical-align:middle;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-categories > li > .arrow:after{
    content:"";
    position:absolute;
    top:-12px;
    right:-12px;
    bottom:-12px;
    left:-12px
}
.portfolio-categories > li.active > a{
    background-color:#20a3f0;
    color:#FFF
}
.portfolio-categories > li.active > .arrow{
    border-color:#FFF
}
.portfolio-categories > li.active > .arrow:before{
    transform:rotate(180deg);
    -webkit-transform:rotate(180deg);
    border-top-color:#FFF
}
.portfolio-categories ul li > .arrow{
    content:"";
    width:45px;
    height:45px;
    line-height:18px;
    text-align:center;
    position:absolute;
    top:0;
    left:0;
    display:inline-block;
    cursor:pointer
}
.portfolio-categories ul li > .arrow:before{
    content:"";
    border-bottom:2px solid #999999;
    display:inline-block;
    vertical-align:middle;
    width:10px;
    position:absolute;
    right:50%;
    top:50%;
    margin:-1px 0 0 -5px;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-categories ul li > .arrow:after{
    content:"";
    border-right:2px solid #999999;
    display:inline-block;
    vertical-align:middle;
    height:10px;
    position:absolute;
    right:50%;
    top:50%;
    margin:-5px 0 0 -1px;
    visibility:visible;
    opacity:1;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-categories ul li.active > .arrow:after{
    visibility:hidden;
    opacity:0
}
.portfolio-categories ul li.active > a{
    color:#20a3f0;
    background-color:#f5f5f5
}
.portfolio-categories ul ul li a{
    padding:10px 12px;
    color:#999999;
    display:block
}
.portfolio-categories ul li a:hover{
    color:#20a3f0
}
.portfolio-categories ul{
    display:none
}
.portfolio-categories .current > ul{
    display:block
}
.portfolio-photolist{
    margin:0 0 0 -2px;
    padding:0;
    font-size:0
}
.portfolio-photolist li{
    list-style:none;
    display:inline-block;
    margin: 0 2px 3px 0;
    font-size:13px
}
.portfolio-tag a{
    display:inline-block;
    margin: 0 0 5px 7px;
    border:1px solid #e5e5e5;
    padding:1px 12px;
    border-radius:3px;
    -moz-border-radius:3px;
    -webkit-border-radius:3px
}
.portfolio-tag a,.portfolio-tag a:link,.portfolio-tag a:active,.portfolio-tag a:visited{
    color:#666666;
    text-decoration:none;
    transition:all ease-in 200ms;
    -moz-transition:all ease-in 200ms;
/* Firefox 4 */
    -webkit-transition:all ease-in 200ms;
/* Safari and Chrome */
    -o-transition:all ease-in 200ms;
/* Opera */
    -ms-transition:all ease-in 200ms;
/* IE9? */
    
}
.portfolio-tag a:hover{
    border-color:#20a3f0;
    color:#20a3f0;
    text-decoration:none
}